Advertisement
hunterthemes

Theme #33

Oct 30th, 2019
760
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 36.33 KB | None | 0 0
  1. <!DOCTYPE html>
  2.  
  3. <!----
  4.  
  5. ©hunterthemes.tumblr.com | Theme #33 (Thriller Themes & Creepy Codes Challenge)
  6.  
  7. * Do not redistribute this theme and claim it as your own.
  8. * Do not remove the credit or move it to another page.
  9. * Minor changes to this theme are allowed.
  10.  
  11. ---->
  12.  
  13. <html>
  14. <head>
  15.  
  16. <meta charset="utf-8">
  17. <meta name="viewport" content="width=device-width, initial-scale=1">
  18. <link rel="shortcut icon" href="{Favicon}">
  19. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  20.  
  21. <title>{Title}
  22. {block:SearchPage} - {lang:Search results for SearchQuery}{/block:SearchPage}
  23. {block:TagPage} - {Tag} {/block:TagPage}
  24. {block:PostSummary}- {PostSummary} {/block:PostSummary}</title>
  25. {block:Description}<meta name="description" content="{MetaDescription}" />
  26. {/block:Description}
  27.  
  28. <!-- GOOGLE FONTS -->
  29.  
  30. <link href="https://fonts.googleapis.com/css?family=Abril+Fatface|Lato|Oswald|Quando|Teko" rel="stylesheet">
  31.  
  32. <!-- DEFAULT VARIABLES -->
  33.  
  34. <meta name="image:Background" content=""/>
  35. <meta name="image:Sidebar image" content=""/>
  36. <meta name="image:Sidebar background" content=""/>
  37. <meta name="image:Avatar" content="" />
  38.  
  39. <meta name="color:Background" content="#ffffff" />
  40. <meta name="color:Panel text" content="#111111" />
  41. <meta name="color:Panel background" content="#ffffff" />
  42. <meta name="color:Menu icon" content="#ffffff" />
  43. <meta name="color:Sidebar background" content="#ffffff" />
  44. <meta name="color:Description" content="#111111" />
  45. <meta name="color:Blog title" content="#000000" />
  46. <meta name="color:Sidebar link" content="#000000" />
  47. <meta name="color:Post background" content="#ffffff" />
  48. <meta name="color:Borders" content="#DDDDDD" />
  49. <meta name="color:Accent" content="#FF6F61" />
  50. <meta name="color:Title" content="#111111" />
  51. <meta name="color:Text" content="#111111" />
  52. <meta name="color:Link" content="#729F51" />
  53. <meta name="color:Icon" content="#729F51" />
  54. <meta name="color:Hover" content="#445533" />
  55. <meta name="color:Chat 1" content="#333333" />
  56. <meta name="color:Chat 2" content="#111111" />
  57. <meta name="color:Bold" content="#FF6F61"/>
  58. <meta name="color:Italic" content="#729F51"/>
  59. <meta name="color:Post buttons" content="#333333" />
  60. <meta name="color:Pagination" content="#ffffff" />
  61. <meta name="color:Scrollbar" content="#FF6F61" />
  62. <meta name="color:Scrollbar background" content="#ffffff" />
  63.  
  64. <meta name="select:Title font" content="Abril Fatface" title="Abril Fatface">
  65. <meta name="select:Title font" content="Lato" title="Lato">
  66. <meta name="select:Title font" content="Oswald" title="Oswald">
  67. <meta name="select:Title font" content="Quando" title="Quando">
  68. <meta name="select:Title font" content="Teko" title="Teko">
  69.  
  70. <meta name="select:Title font size" content="25px" title="25px">
  71. <meta name="select:Title font size" content="30px" title="30px">
  72. <meta name="select:Title font size" content="35px" title="35px">
  73. <meta name="select:Title font size" content="40px" title="40px">
  74. <meta name="select:Title font size" content="45px" title="45px">
  75.  
  76. <meta name="select:Blog title font size" content="22px" title="22px">
  77. <meta name="select:Blog title font size" content="24px" title="24px">
  78. <meta name="select:Blog title font size" content="26px" title="26px">
  79. <meta name="select:Blog title font size" content="28px" title="28px">
  80. <meta name="select:Blog title font size" content="30px" title="30px">
  81.  
  82. <meta name="font:Body font" content="Helvetica"/>
  83. <meta name="select:Body font size" content="12px" title="12px">
  84. <meta name="select:Body font size" content="13px" title="13px">
  85. <meta name="select:Body font size" content="14px" title="14px">
  86. <meta name="select:Body font size" content="15px" title="15px">
  87. <meta name="select:Body font size" content="16px" title="11px">
  88.  
  89. <meta name="select:Post width" content="600" title="600px">
  90. <meta name="select:Post width" content="540" title="540px">
  91. <meta name="select:Post width" content="500" title="500px">
  92. <meta name="select:Post width" content="400" title="400px">
  93. <meta name="select:Post width" content="300" title="300px">
  94.  
  95. <meta name="if:Spooky" content="1" />
  96. <meta name="if:Inverted Controls" content="0" />
  97. <meta name="if:Infinite Scroll" content="0" />
  98. <meta name="if:Load More" content="0" />
  99. <meta name="if:Display Search Box" content="1" />
  100. <meta name="if:Display Avatar" content="1" />
  101. <meta name="if:Circular Avatar" content="1" />
  102. <meta name="if:Display Navigation" content="1" />
  103. <meta name="if:Ask Enabled" content="1" />
  104. <meta name="if:Submissions Enabled" content="1" />
  105. <meta name="if:Hover For Info" content="0" />
  106. <meta name="if:Display Captions" content="1" />
  107. <meta name="if:Display Tags" content="1" />
  108.  
  109. <meta name="if:Display Link One" content="1" />
  110. <meta name="if:Display Link Two" content="1" />
  111. <meta name="if:Display Link Three" content="1" />
  112. <meta name="if:Display Link Four" content="1" />
  113. <meta name="if:Display Link Five" content="1" />
  114. <meta name="if:Display Link Six" content="1" />
  115.  
  116. <meta name="text:Link One Title" content="LINK ONE" />
  117. <meta name="text:Link One Url" content="http://"/>
  118. <meta name="text:Link Two Title" content="LINK TWO"/>
  119. <meta name="text:Link Two Url" content="http://"/>
  120. <meta name="text:Link Three Title" content="LINK THREE" />
  121. <meta name="text:Link Three Url" content="http://" />
  122. <meta name="text:Link Four Title" content="LINK FOUR" />
  123. <meta name="text:Link Four Url" content="http://" />
  124. <meta name="text:Link Five Title" content="LINK FIVE" />
  125. <meta name="text:Link Five Url" content="http://" />
  126. <meta name="text:Link Six Title" content="LINK SIX" />
  127. <meta name="text:Link Six Url" content="http://" />
  128.  
  129. <meta name="text:Border radius" content="10px"/>
  130. <meta name="text:Subtitle" content="Subtitle" />
  131.  
  132. <!-- END DEFAULT VARIABLES -->
  133.  
  134. <style type="text/css">
  135.  
  136. /* CSS */
  137.  
  138. /*-- GENERAL --*/
  139.  
  140. body {
  141. margin:0;
  142. padding:0;
  143. width:100%;
  144. height:100%;
  145. word-wrap:break-word;
  146. color:{color:Text};
  147. font-family:{font:Body font};
  148. font-size:{select:Body font size};
  149. line-height: calc({select:Body font size} + 7px);
  150. background-color: {color:Background};
  151. background-image:url({image:Background});
  152. background-attachment: fixed;
  153. background-repeat: repeat;
  154. }
  155.  
  156. /* Headings */
  157.  
  158. h1 {
  159. margin:0;
  160. padding:0;
  161. padding-bottom:5px;
  162. color:{color:Title};
  163. font-family:{select:Title font};
  164. font-size:{select:Title font size};
  165. line-height:calc({select:Title font size} + 7px);
  166. }
  167.  
  168. h2 {
  169. font-family:{font:Body font};
  170. font-size:150%;
  171. font-weight:normal;
  172. }
  173.  
  174. /* Paragraph */
  175.  
  176. p {
  177. padding:0 10px;
  178. }
  179.  
  180. p ul, p ol, p li {
  181. margin:5px 10px;
  182. padding:0;
  183. }
  184.  
  185. /* Links */
  186.  
  187. a {
  188. color:{color:Link};
  189. text-decoration:none;
  190. transition:all .3s linear;
  191. -webkit-transition:all .5s linear;
  192. -o-transition:all .5s linear;
  193. -moz-transition:all .5s linear;
  194. }
  195.  
  196. a:hover {
  197. color:{color:Link Hover};
  198. }
  199.  
  200. /* Bold and italic */
  201.  
  202. b, strong {color:{color:Bold};}
  203.  
  204. i, em {color:{color:Italic};}
  205.  
  206. /* Blockquote */
  207.  
  208. blockquote {
  209. padding:0 0 2px 5px;
  210. margin:0 0 2px 10px;
  211. border-left: 1px dotted #555555;
  212. }
  213.  
  214. /* Tumblr controls */
  215.  
  216. iframe.tmblr-iframe {
  217. top:4px!important;
  218. right:40px!important;
  219. opacity:0.8;
  220. transform:scale(0.6);
  221. transform-origin:100% 0;
  222. -webkit-transform:scale(0.8);
  223. -webkit-transform-origin:100% 0;
  224. -o-transform:scale(0.8);
  225. -o-transform-origin:100% 0;
  226. -moz-transform:scale(0.8);
  227. -moz-transform-origin:100% 0;
  228. -ms-transform:scale(0.8);
  229. -ms-transform-origin:100% 0;
  230. z-index:100000!important;
  231. {block:ifInvertedControls}
  232. filter:invert(100%) hue-rotate(180deg);
  233. -webkit-filter:invert(100%) hue-rotate(180deg);
  234. -moz-filter:invert(100%) hue-rotate(180deg);
  235. -o-filter:invert(100%) hue-rotate(180deg);
  236. -ms-filter:invert(100%) hue-rotate(180deg);
  237. {/block:ifInvertedControls}
  238. }
  239.  
  240. iframe.tmblr-iframe:hover {
  241. opacity:1!important;
  242. }
  243.  
  244. .tmblr-iframe--app-cta-button {
  245. display: none!important;
  246. }
  247.  
  248. /* Webkit scrollbar */
  249.  
  250. ::-webkit-scrollbar {
  251. width: 9px;
  252. height:0;
  253. }
  254.  
  255. ::-webkit-scrollbar-button:start:decrement,
  256. ::-webkit-scrollbar-button:end:increment {
  257. height:0;
  258. display: block;
  259. background-color: {color:Scrollbar background};
  260. }
  261.  
  262. ::-webkit-scrollbar-track-piece {
  263. background-color: {color:Scrollbar background};
  264. }
  265.  
  266. ::-webkit-scrollbar-thumb:vertical {
  267. height:0;
  268. background-color: {color:Scrollbar};
  269. border:4px solid {color:Scrollbar background};
  270. }
  271.  
  272. /* Tooltips */
  273.  
  274. #s-m-t-tooltip {
  275. max-width:300px;
  276. margin-left:10px;
  277. margin-top:10px;
  278. padding:2px 4px;
  279. font-size:12px;
  280. line-height:15px;
  281. color:{color:Sidebar icon};
  282. background:{color:Sidebar background};
  283. border:1px solid {color:Borders};
  284. border-radius:{text:Border radius};
  285. z-index:10000;
  286. }
  287.  
  288. /* Fix */
  289.  
  290. iframe, img, embed, object, video {
  291. max-width:100%;
  292. border:none;
  293. }
  294.  
  295. .video * {
  296. display:block;
  297. min-width:100%;
  298. }
  299.  
  300. input, textarea, select, a { outline:none; }
  301.  
  302. /*--- MENU ---*/
  303.  
  304. #menu {
  305. position:fixed;
  306. top:0;
  307. left:0;
  308. width:60px;
  309. height:100%;
  310. background:{color:Accent};
  311. border-bottom:1px solid {color:Borders};
  312. z-index:1000;
  313. }
  314.  
  315. /* Main links */
  316.  
  317. #main-links {
  318. position:fixed;
  319. margin-top:10px;
  320. margin-left:10px;
  321. width:50px;
  322. line-height:30px;
  323. list-style:none;
  324. }
  325.  
  326. #main-links a {
  327. display:block;
  328. margin-top:15px;
  329. width:37px;
  330. height:30px;
  331. padding:5px 0 5px 13px;
  332. border-top-left-radius:20px;
  333. border-bottom-left-radius:20px;
  334. -webkit-transition:all .5s linear;
  335. -o-transition:all .5s linear;
  336. -moz-transition:all .5s linear;
  337. }
  338.  
  339. #main-links span {
  340. font-size:15px;
  341. color:{color:Menu icon};
  342. cursor:pointer;
  343. transition:all .3s linear;
  344. -webkit-transition:all .5s linear;
  345. -o-transition:all .5s linear;
  346. -moz-transition:all .5s linear;
  347. }
  348.  
  349. #main-links a:hover,
  350. #main-links a.selected,
  351. #open-sidebar.selected,
  352. #open-search.selected {
  353. color:{color:Accent}!important;
  354. background:{color:Panel background}!important;
  355. }
  356.  
  357. #main-links a:hover span,
  358. #main-links a.selected span,
  359. #open-sidebar.selected,
  360. #open-search.selected {
  361. color:{color:Accent}!important;
  362. }
  363.  
  364. #main-links li.selected a { cursor:default }
  365.  
  366. a#open-sidebar {
  367. display:none!important;
  368. }
  369.  
  370. /* Search box */
  371.  
  372. #search-panel {
  373. position:fixed;
  374. top:0;
  375. left:60px;
  376. width:calc(100vw - 150px);
  377. height:calc(100vh - 100px);
  378. padding:50px;
  379. font-size:13px;
  380. line-height:16px;
  381. color:{color:Panel text};
  382. background:{color:Panel background};
  383. display:none;
  384. z-index:100000;
  385. }
  386.  
  387. #search {
  388. position:fixed;
  389. top:50%;
  390. left:150px;
  391. width:calc(100vw - 150px);
  392. height:auto;
  393. -webkit-transform:translateY(-50%);
  394. -moz-transform:translateY(-50%);
  395. -ms-transform:translateY(-50%);
  396. transform:translateY(-50%);
  397. }
  398.  
  399. #search h2 {
  400. margin-left:auto;
  401. margin-right:auto;
  402. margin-bottom:30px;
  403. border-bottom:none;
  404. color:{color:Title};
  405. text-align:center;
  406. font-size:30px;
  407. }
  408.  
  409. #search h2::after {
  410. content: '';
  411. display:block;
  412. margin-top:15px;
  413. margin-left:auto;
  414. margin-right:auto;
  415. width:40px;
  416. height:2px;
  417. background:{color:Accent};
  418. }
  419.  
  420. .requiro {
  421. margin:0 auto;
  422. width:50%;
  423. height:50px;
  424. line-height:50px;
  425. cursor:pointer;
  426. color:{color:Panel text};
  427. border-bottom:1px solid {color:Accent};
  428. padding:5px 10px;
  429. z-index:100;
  430. }
  431.  
  432. .requiro span {
  433. position:absolute;
  434. margin-left:-10px;
  435. color:{color:Panel text};
  436. }
  437.  
  438. input:focus::-webkit-input-placeholder {
  439. color:transparent;
  440. }
  441.  
  442. input:focus:-moz-placeholder {
  443. color:transparent;
  444. }
  445.  
  446. input:focus::-moz-placeholder {
  447. color:transparent;
  448. }
  449.  
  450. input:focus:-ms-input-placeholder {
  451. color:transparent;
  452. }
  453.  
  454. .requiro input{
  455. outline:none;
  456. border:0;
  457. width:100%;
  458. margin:0;
  459. padding:0;
  460. background:transparent;
  461. font-size:16px;
  462. }
  463.  
  464. .requiro input[type=text]{
  465. color:{color:Panel text};}
  466. input::-webkit-input-placeholder{
  467. color:{color:Panel text};}
  468. input::-moz-placeholder{
  469. color:{color:Panel text};}
  470. input:-moz-placeholder{
  471. color:{color:Panel text};}
  472. input:-ms-input-placeholder{
  473. color:{color:Panel text};}
  474.  
  475. /* Close button */
  476.  
  477. #close-sidebar,
  478. #close-search {
  479. position:absolute;
  480. top:0;
  481. right:9px;
  482. width:70px;
  483. height:70px;
  484. line-height:70px;
  485. text-align:center;
  486. background:{color:Accent};
  487. border-bottom-left-radius:35px;
  488. z-index:100;
  489. cursor:pointer;
  490. }
  491.  
  492. #close-sidebar span, #close-search span {
  493. color:{color:Menu icon};
  494. font-size:20px;
  495. }
  496.  
  497. /*-- SIDEBAR --*/
  498.  
  499. #sidebar {
  500. position:fixed;
  501. top:0;
  502. right:0;
  503. width:30vw;
  504. height:100vh;
  505. font-size:{select:Body font size};
  506. line-height: calc({select:Body font size} + 7px);
  507. background:{color:Sidebar background};
  508. background-image:url({image:Sidebar background});
  509. z-index:10000;
  510. overflow:hidden;
  511. }
  512.  
  513. /*-- Sidebar image --*/
  514.  
  515. #sidebar-image {
  516. margin-top:0;
  517. margin-left:0;
  518. width:100%;
  519. height:auto;
  520. {block:ifSpooky}
  521. min-height:190px;
  522. {block:ifSpooky}
  523. max-height:30vh;
  524. overflow:hidden;
  525. }
  526.  
  527. #frame {
  528. position:fixed;
  529. top:0;
  530. width:100%
  531. z-index:10;
  532. }
  533.  
  534. /* Blog title */
  535.  
  536. .blog-title {
  537. margin-top:20px;
  538. margin-left:20px;
  539. width:calc(100% - 40px);
  540. height:60px;
  541. line-height:30px;
  542. letter-spacing:2px;
  543. font-family:{select:Title font};
  544. font-size:{select:Blog title font size};
  545. color:{color:Blog title};
  546. }
  547.  
  548. .blog-title:hover {
  549. color:{color:Hover};
  550. }
  551.  
  552. .blog-title span {
  553. font-family:{font:Body font};
  554. font-size:{select:Body font size};
  555. letter-spacing:0;
  556. }
  557.  
  558. /* Avatar */
  559.  
  560. .avatar {
  561. margin-right:20px;
  562. float:left;
  563. width:60px;
  564. height:60px;
  565. border-radius:{text:Border radius};
  566. border:1px solid {color:Accent};
  567. {block:ifCircularAvatar}
  568. border-radius:100px;
  569. {/block:ifCircularAvatar}
  570. -webkit-transition:all .5s linear;
  571. -o-transition:all .5s linear;
  572. -moz-transition:all .5s linear;
  573. }
  574.  
  575. .avatar:hover {
  576. border:1px solid {color:Hover};
  577. }
  578.  
  579. .avatar img {
  580. width:100%;
  581. height:100%;
  582. border-radius:{text:Border radius};
  583. {block:ifCircularAvatar}
  584. border-radius:100px;
  585. {/block:ifCircularAvatar}
  586. }
  587.  
  588. /* Description */
  589.  
  590. .description {
  591. margin-top:20px;
  592. margin-left:20px ;
  593. width:calc(100% - 50px);
  594. max-height:25vh;
  595. padding-right:10px;
  596. color:{color:Description};
  597. text-align:justify;
  598. overflow-y:auto;
  599. font-family:{font:Body font};
  600. font-size:{select:Body font size};
  601. line-height: calc({select:Body font size} + 7px);
  602. }
  603.  
  604. .divider {
  605. margin-top:20px;
  606. margin-left:20px ;
  607. width:calc(100% - 40px);
  608. {block:ifnotSpooky}
  609. border-bottom:1px solid {color:Accent};
  610. {/block:ifnotSpooky}
  611. }
  612.  
  613. /* Links */
  614.  
  615. .links {
  616. margin-top:20px;
  617. margin-left:20px;
  618. width:calc(100% - 40px);
  619. height:auto;
  620. max-height:30vh;
  621. line-height:24px;
  622. }
  623.  
  624. .links a {
  625. display:inline-block;
  626. margin-top:10px;
  627. min-width:calc(50% - 30px);
  628. text-transform:uppercase;
  629. text-align:right;
  630. color:{color:Sidebar link};
  631. }
  632.  
  633. .links a:nth-child(odd) {
  634. margin-right:55px;
  635. }
  636.  
  637. .links a:hover {
  638. color:{color:Hover};
  639. }
  640.  
  641. .links span {
  642. float:left;
  643. color:{color:Accent};
  644. font-size:12px;
  645. margin-right:5px;
  646. padding:0 5px;
  647. text-align:center;
  648. color:{color:Menu icon};
  649. background:{color:Accent};
  650. border-radius:calc({text:Border radius} - 2px);
  651. }
  652.  
  653. /*---------------------------- MAIN CONTAINER ----------------------------*/
  654.  
  655. #container {
  656. margin-top:0;
  657. margin-left:60px;
  658. width:calc(70vw - 70px);
  659. min-height:600px;
  660. z-index:10;
  661. }
  662.  
  663. /*------ POSTS AND ENTRIES -----*/
  664.  
  665. #posts {
  666. display:block;
  667. position:relative;
  668. margin-top:30px;
  669. margin-left:auto;
  670. margin-right:auto;
  671. width:calc({select:Post width}px + 72px);
  672. max-width:calc(70vw - 25px);
  673. {block:PermalinkPage}
  674. width:562px!important;
  675. {/block:PermalinkPage}
  676. }
  677.  
  678. .entry {
  679. float:left;
  680. display:block;
  681. margin:20px;
  682. width:{select:Post width}px;
  683. padding:15px;
  684. padding-bottom:10px;
  685. background:{color:Post background};
  686. border:1px solid {color:Borders};
  687. border-radius:{text:Border radius};
  688. overflow:hidden;
  689. }
  690.  
  691. .entry img { max-width:100%; }
  692.  
  693. /* -------- RESPONSIVE DESIGN VALUES, editing is not recommended -------- */
  694.  
  695. @media only screen and (max-width:750px) {
  696.  
  697. a#open-sidebar {
  698. display:block!important;
  699. }
  700.  
  701. #sidebar {
  702. position:fixed;
  703. top:0;
  704. right:0;
  705. width:calc(100vw - 70px)!important;
  706. height:100vh;
  707. font-size:{select:Body font size};
  708. line-height: calc({select:Body font size} + 7px);
  709. background:{color:Sidebar background};
  710. background-image:{image:Sidebar background};
  711. z-index:10000;
  712. display:none;
  713. }
  714.  
  715. #container {
  716. width:calc(100vw - 70px)!important;
  717. }
  718.  
  719. #posts {
  720. margin:20px 0;
  721. width:calc(100vw - 60px)!important;
  722. max-width:calc(100vw - 60px)!important;
  723. {block:PermalinkPage}
  724. width:calc(100vw - 60px)!important;
  725. max-width:calc(100vw - 60px)!important;
  726. {/block:PermalinkPage}
  727. }
  728.  
  729. .entry {
  730. float:left;
  731. display:block;
  732. margin:25px!important;
  733. width:calc(100vw - 152px)!important;
  734. min-width:300px;
  735. z-index:100;
  736. {block:PermalinkPage}
  737. width:calc(100vw - 152px)!important;
  738. {/block:PermalinkPage}
  739. }
  740.  
  741. .blog-title {
  742. font-size:calc({select:Blog title font size} - 5px)!important;
  743. }
  744.  
  745. #pager {
  746. margin-left:0;
  747. width:100vw!important;
  748. {block:PermalinkPage}
  749. width:100vw!important;
  750. {/block:PermalinkPage}
  751. min-width:300px;
  752. }
  753.  
  754. #sidebar-image {
  755. {block:ifSpooky}
  756. max-height:120px!important;
  757. {block:ifSpooky}
  758. }
  759.  
  760. }
  761.  
  762. /* End responsive values */
  763.  
  764.  
  765. /* -- POST STYLES -- */
  766.  
  767. /* Quote posts */
  768.  
  769. .quote {
  770. margin:5px;
  771. padding:10px;
  772. font-family:{select:Title font};
  773. font-size:200%;
  774. line-height:130%;
  775. color:{color:Italic};
  776. height:auto;
  777. text-align:center;
  778. letter-spacing:1px;
  779. }
  780.  
  781. .source {
  782. margin-top:5px;
  783. margin-bottom:10px;
  784. font-family:{font:Body font};
  785. font-size:15px;
  786. height:25px;
  787. line-height:25px;
  788. text-align:left;
  789. overflow:hidden;
  790. }
  791.  
  792. .source span {
  793. float:left;
  794. margin-right:10px;
  795. color:{color:Link};
  796. padding:5px;
  797. padding-right:10px;
  798. font-size:15px;
  799. border-right:1px solid {color:Borders};
  800. }
  801.  
  802. /* Link posts */
  803.  
  804. .linktitle {
  805. width:calc(100% - 10px);
  806. color:{color:Title};
  807. font-family:{select:Title font};
  808. font-size:200%;
  809. line-height:150%;
  810. background:{color:Borders};
  811. border-radius:{text:Border radius};
  812. padding:5px;
  813. {block:ifEntryBorderTransparent}
  814. background:transparent;
  815. border:1px solid transparent;
  816. {/block:ifEntryBorderTransparent}
  817. }
  818.  
  819. .linktitle a {
  820. color:{color:Link};
  821. }
  822.  
  823. .linktitle span {
  824. color:{color:Icon};
  825. }
  826.  
  827. .linktitle:hover {
  828. color:{color:Hover};
  829. }
  830.  
  831. /* Audio posts */
  832.  
  833. .album img {
  834. float:left;
  835. margin-top:0;
  836. width:70px;
  837. height:70px;
  838. margin-left:5px;
  839. margin-right:10px;
  840. float:left;
  841. z-index:10;
  842. border:1px solid {color:Borders};
  843. border-radius:100%;
  844. }
  845.  
  846. .play {
  847. position:absolute;
  848. margin:22px 25px;
  849. width:31px;
  850. height:29px;
  851. padding-top:2px;
  852. line-height:31px;
  853. overflow:hidden;
  854. background:#fff;
  855. border-radius:100%;
  856. }
  857.  
  858. .audio {
  859. width:160px;
  860. min-height:80px;
  861. margin-top:10px;
  862. z-index:10;
  863. font-size:12px;
  864. line-height:25px;
  865. overflow:hidden;
  866. }
  867.  
  868. .audio h1{
  869. font-size:20px;
  870. border-bottom:1px solid transparent;
  871. }
  872.  
  873. /* Ask posts */
  874.  
  875. .question {
  876. width:100%;
  877. height:auto;
  878. line-height:20px;
  879. color:{color:Answer};
  880. }
  881.  
  882. .questionin {
  883. margin-left:45px;
  884. width:calc(100% - 65px);
  885. min-height:24px;
  886. line-height:24px;
  887. padding:5px;
  888. padding-left:10px;
  889. padding-right:10px;
  890. border:1px solid {color:Borders};
  891. border-top-right-radius:{text:Border radius};
  892. border-bottom-right-radius:{text:Border radius};
  893. }
  894.  
  895. .question img {
  896. width:28px;
  897. padding:3px;
  898. border:1px solid {color:Borders};
  899. margin-right:4px;
  900. border-top-left-radius:{text:Border radius};
  901. border-bottom-left-radius:{text:Border radius};
  902. }
  903.  
  904. .answer {
  905. margin-top:5px;
  906. width:calc(100% - 10px);
  907. padding:5px;
  908. }
  909.  
  910. /* Chat posts */
  911.  
  912. .chat ul {
  913. display:block;
  914. list-style:none;
  915. margin-left:-40px;
  916. }
  917.  
  918. /* Chat lines style */
  919. .chat li {
  920. padding:3px;
  921. display:block;
  922. }
  923.  
  924. /* Odd lines style */
  925. .chat .odd {
  926. color:{color:Chat 1};
  927. }
  928.  
  929. /* Even lines style */
  930. .chat .even {
  931. color:{color:Chat 2};
  932. }
  933.  
  934. /* -- POST INFO -- */
  935.  
  936. .info {
  937. height:auto;
  938. margin-top:15px;
  939. margin-left:0;
  940. margin-bottom:-5px;
  941. width:100%;
  942. line-height:20px;
  943. font-size:12px;
  944. color:{color:Text};
  945. border-bottom-left-radius:{text:Border radius};
  946. border-bottom-right-radius:{text:Border radius};
  947. {block:IndexPage}
  948. {block:ifHoverForInfo}
  949. opacity:0;
  950. position:absolute;
  951. bottom:0;
  952. background:{color:Post background};
  953. {/block:ifHoverForInfo}
  954. {/block:IndexPage}
  955. {block:PermalinkPage}
  956. border-radius:0;
  957. {/block:PermalinkPage}
  958. }
  959.  
  960. .entry:hover .info {
  961. {block:ifHoverForInfo}
  962. opacity:1;
  963. {/block:ifHoverForInfo}
  964. }
  965.  
  966. .info a {
  967. font-size:12px;
  968. }
  969.  
  970. .info a:hover {
  971. color:{color:Hover};
  972. }
  973.  
  974. .info big a {
  975. color:{color:Bold};
  976. font-size:14px;
  977. }
  978.  
  979. /* Tags */
  980.  
  981. .tags {
  982. margin-top:5px;
  983. margin-left:0;
  984. line-height:20px;
  985. }
  986.  
  987. .tags a {
  988. margin-right:5px;
  989. margin-bottom:5px;
  990. background:{color:Post background};
  991. }
  992.  
  993. .tags span {
  994. margin-top:5px;
  995. margin-right:10px;
  996. font-size:14px;
  997. color:{color:Text};
  998. vertical-align:middle;
  999. }
  1000.  
  1001. /*-- PERMALINK, LIKE AND REBLOG BUTTONS --*/
  1002.  
  1003. .post_buttons {
  1004. width:45px;
  1005. height:19px;
  1006. margin-left:calc(100% - 70px);
  1007. margin-top:-20px;
  1008. padding-top:2px;
  1009. text-align:center;
  1010. z-index:100;
  1011. list-style:none;
  1012. {block:PermalinkPage}
  1013. padding-right:15px;
  1014. {/block:PermalinkPage}
  1015. }
  1016.  
  1017. .post_buttons span {
  1018. font-size:12px;
  1019. color:{color:Post buttons};
  1020. }
  1021.  
  1022. .perma {
  1023. position:absolute;
  1024. width:20px;
  1025. margin-left:-30px;
  1026. margin-top:-20px;
  1027. }
  1028.  
  1029. .rblg {
  1030. position:absolute;
  1031. margin-top:0;
  1032. margin-left:-5px;
  1033. }
  1034.  
  1035. .like {
  1036. position:relative;
  1037. }
  1038.  
  1039. .like .like_button {
  1040. position:absolute;
  1041. margin-top:-21px;
  1042. margin-left:15px;
  1043. opacity:0;
  1044. }
  1045.  
  1046. .like .like_button.liked {
  1047. opacity:1;
  1048. }
  1049.  
  1050. /*-- PERMALINK PAGE --*/
  1051.  
  1052. .postnotes {
  1053. margin:10px 0;
  1054. width:100%;
  1055. font-size:12px;
  1056. color:{color:Text};
  1057. line-height:20px;
  1058. text-align:left;
  1059. overflow:hidden;
  1060. }
  1061.  
  1062. ol.notes {
  1063. display:block;
  1064. padding:0;
  1065. margin:10px 0;
  1066. width:100%;
  1067. list-style-type:none;
  1068. }
  1069.  
  1070. ol.notes li.note {
  1071. padding:10px;
  1072. border-bottom:1px solid {color:Borders};
  1073. }
  1074.  
  1075. ol.notes li.note img.avatar {
  1076. vertical-align:-5px;
  1077. margin-right:10px;
  1078. width:15px;
  1079. height:15px;
  1080. }
  1081.  
  1082. li.more_notes_link_container {
  1083. text-transform:uppercase;
  1084. font-size:12px;
  1085. }
  1086.  
  1087. /*-- PAGINATION --*/
  1088.  
  1089. #pager {
  1090. margin-top:20px;
  1091. margin-left:auto;
  1092. margin-right:auto;
  1093. width:calc({select:Post width}px + 72px);
  1094. height:70px;
  1095. {block:PermalinkPage}
  1096. width:562px!important;
  1097. {/block:PermalinkPage}
  1098. }
  1099.  
  1100. #pagination {
  1101. margin:auto;
  1102. width:500px;
  1103. height:30px;
  1104. text-align:center;
  1105. {block:ifInfiniteScroll}
  1106. display:none;
  1107. {/block:ifInfiniteScroll}
  1108. }
  1109.  
  1110. .pagicon, .next, .load-more {
  1111. display:inline;
  1112. vertical-align:middle;
  1113. }
  1114.  
  1115. .pagicon a, .next, .load-more {
  1116. font-size:12px;
  1117. padding:8px 10px;
  1118. margin:10px;
  1119. color:{color:Pagination};
  1120. background:{color:Accent};
  1121. border:1px solid {color:Borders};
  1122. border-radius:{text:Border radius};
  1123. }
  1124.  
  1125. .pagicon a:hover, .next:hover, .load-more:hover {
  1126. color:{color:Hover};
  1127. }
  1128.  
  1129. .pagicon span, .next span, .load-more span {
  1130. color:{color:Pagination};
  1131. font-size:11px;
  1132. margin:5px;
  1133. text-decoration:none;
  1134. vertical-align:middle;
  1135. }
  1136.  
  1137. .pagicon:hover span, .next:hover span, .load-more:hover span {
  1138. color:{color:Hover};
  1139. }
  1140.  
  1141. /* -- INFINITE SCROLL -- */
  1142.  
  1143. #infscr-loading {
  1144. display:none!important;
  1145. }
  1146.  
  1147. #iscroll {
  1148. margin:auto;
  1149. width:500px;
  1150. height:30px;
  1151. text-align:center;
  1152. }
  1153.  
  1154. {block:ifLoadMore}
  1155. .load-more {
  1156. height:40px;
  1157. }
  1158. {/block:ifLoadMore}
  1159.  
  1160. /*-- THEME CREDIT --*/
  1161.  
  1162. #credit {
  1163. position:fixed;
  1164. right:10px;
  1165. top:10px;
  1166. width:30px;
  1167. z-index:10000;
  1168. }
  1169.  
  1170. /* END CSS */
  1171.  
  1172. {CustomCSS}
  1173.  
  1174. </style>
  1175.  
  1176. </head>
  1177.  
  1178. <!-- HTML -->
  1179.  
  1180. <body>
  1181.  
  1182. {block:IfDisplaySearchBox}
  1183.  
  1184. <div id="search-panel">
  1185.  
  1186. <div id="close-search"><span class="sf sf-cross-o"></span></div>
  1187.  
  1188. <div class="panel-image"></div>
  1189.  
  1190. <div id="search">
  1191.  
  1192. <h2> Search the blog </h2>
  1193.  
  1194. <form class="requiro" action="/search" method="get"><input type="text" name="q" placeholder="Enter your search query" value=""/><span class="sf sf-search-o"></span></form>
  1195.  
  1196. </div>
  1197. <!-- End search -->
  1198.  
  1199. </div>
  1200. <!-- End search-panel -->
  1201. {/block:IfDisplaySearchBox}
  1202.  
  1203.  
  1204. <div id="menu">
  1205.  
  1206. <div id="main-links">
  1207.  
  1208. <a id="open-sidebar"><span class="sf sf-list-o"></span></a>
  1209.  
  1210. {block:ifSpooky}
  1211. <a href="/" title="HOME"><span class="sf sf-bat-o"></span></a>
  1212. {/block:ifSpooky}
  1213. {block:ifnotSpooky}
  1214. <a href="/" title="HOME"><span class="sf sf-home-o"></span></a>
  1215. {/block:ifnotSpooky}
  1216.  
  1217. {block:ifAskEnabled}
  1218. {block:ifSpooky}
  1219. <a href="/ask" title="ASK"><span class="sf sf-brain-o"></span></a>
  1220. {/block:ifSpooky}
  1221. {block:ifnotSpooky}
  1222. <a href="/ask" title="ASK"><span class="sf sf-envelope-2-o"></span></a>
  1223. {/block:ifnotSpooky}
  1224. {/block:ifAskEnabled}
  1225.  
  1226. {block:ifSubmissionsEnabled}
  1227. {block:ifSpooky}
  1228. <a href="/submit" title="SUBMIT"><span class="sf sf-skull-1-o"></span><br></a>
  1229. {/block:ifSpooky}
  1230.  
  1231. {block:ifnotSpooky}
  1232. <a href="/submit" title="SUBMIT"><span class="sf sf-pencil-o"></span></a>
  1233. {/block:ifnotSpooky}
  1234. {/block:ifSubmissionsEnabled}
  1235.  
  1236. {block:ifSpooky}
  1237. <a href="/archive" title="ARCHIVE"><span class="sf sf-spider-o"></span></a>
  1238. {/block:ifSpooky}
  1239.  
  1240. {block:ifnotSpooky}
  1241. <a href="/archive" title="ARCHIVE"><span class="sf sf-clock-3-o"></span></a>
  1242. {/block:ifnotSpooky}
  1243.  
  1244. {block:IfDisplaySearchBox}
  1245. <a id="open-search"><span class="sf sf-search-o"></span></a>
  1246. {/block:IfDisplaySearchBox}
  1247.  
  1248. </div>
  1249. <!--End main-links -->
  1250.  
  1251. </div>
  1252. <!-- End menu -->
  1253.  
  1254. <div id="sidebar">
  1255.  
  1256. <div id="sidebar-image">
  1257. <img src="{image:Sidebar image}">
  1258.  
  1259. {block:ifSpooky}
  1260. <div id="frame"><img src="https://i.imgur.com/HyDgWPN.png"></div>
  1261. {/block:ifSpooky}
  1262.  
  1263. </div>
  1264. <!-- End Sidebar image -->
  1265.  
  1266. <div class="blog-title">
  1267.  
  1268. <div class="avatar"><img src="{image:Avatar}"></div>
  1269.  
  1270. {Title}<br>
  1271. <span> {text:Subtitle} </span>
  1272.  
  1273. </div>
  1274. <!-- End blog-title -->
  1275.  
  1276. <div class="description-box">
  1277. <div class="description">
  1278. {Description}
  1279. </div>
  1280. <!--End description-->
  1281. </div>
  1282. <!--End description-box -->
  1283.  
  1284. <div class="divider">
  1285. {block:ifSpooky}
  1286. <img src="https://i.imgur.com/17snlAh.png">
  1287. {/block:ifSpooky}
  1288. </div>
  1289. <!--End divider -->
  1290.  
  1291. <div class="links">
  1292. {block:IfDisplayLinkOne}
  1293. <a href="{text:Link One Url}"><span>01</span> {text:Link One Title} </a>
  1294. {/block:IfDisplayLinkOne}
  1295. {block:IfDisplayLinkTwo}
  1296. <a href="{text:Link Two Url}"><span>02</span> {text:Link Two Title} </a>
  1297. {/block:IfDisplayLinkTwo}
  1298. {block:IfDisplayLinkThree}
  1299. <a href="{text:Link Three Url}"><span>03</span> {text:Link Three Title} </a>
  1300. {/block:IfDisplayLinkThree}
  1301. {block:IfDisplayLinkFour}
  1302. <a href="{text:Link Four Url}"><span>04</span> {text:Link Four Title} </a>
  1303. {/block:IfDisplayLinkFour}
  1304. {block:IfDisplayLinkFive}
  1305. <a href="{text:Link Five Url}"><span>05</span> {text:Link Five Title} </a>
  1306. {/block:IfDisplayLinkFive}
  1307. {block:IfDisplayLinkSix}
  1308. <a href="{text:Link Six Url}"><span>06</span> {text:Link Six Title} </a>
  1309. {/block:IfDisplayLinkSix}
  1310. </div>
  1311. <!--End links-->
  1312.  
  1313. </div>
  1314. <!--End sidebar -->
  1315.  
  1316.  
  1317. <div id="container">
  1318.  
  1319. <!-- POSTS -->
  1320.  
  1321. <div id="posts">
  1322.  
  1323. {block:Posts}
  1324.  
  1325. <div class="entry">
  1326.  
  1327. <div class="content">
  1328.  
  1329. <!-- Text -->
  1330. {block:Text}
  1331. {block:Title}
  1332. <a href="{Permalink}">
  1333. <h1>{Title}</h1></a>
  1334. {/block:Title}
  1335. {Body}
  1336. {/block:Text}
  1337.  
  1338. <!-- Photo -->
  1339. {block:Photo}
  1340. {block:IndexPage}
  1341. {LinkOpenTag}
  1342. <img src="{PhotoURL-500}" alt="{PhotoAlt}" width="680px"/>
  1343. {LinkCloseTag}
  1344. {/block:IndexPage}
  1345. {block:PermalinkPage}
  1346. {LinkOpenTag}
  1347. <img src="{PhotoURL-500}" alt="{PhotoAlt}" width="680px"/>
  1348. {LinkCloseTag}
  1349. {/block:PermalinkPage}
  1350. {/block:Photo}
  1351.  
  1352. <!-- Photoset -->
  1353. {block:Photoset}
  1354. <div class="photo-slideDisplay" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  1355. {/block:Photoset}
  1356.  
  1357. <!-- Quote -->
  1358. {block:Quote}
  1359. <div class="source">
  1360. <span class="sf sf-quotation-mark"></span>
  1361. {block:Source}
  1362. {Source}
  1363. {/block:Source}
  1364. </div>
  1365. <!--End source-->
  1366. <div class="quote">
  1367. {Quote}
  1368. </div>
  1369. <!--End quote-->
  1370. {/block:Quote}
  1371.  
  1372. <!-- Link -->
  1373. {block:Link}
  1374. <div id="linktitle">
  1375. <a href="{URL}"
  1376. class="linkpost"
  1377. target="_blank">
  1378. {Name} &raquo; </a>
  1379. </div>
  1380. {block:Description}
  1381. {Description}
  1382. {/block:Description}
  1383. {/block:Link}
  1384.  
  1385. <!-- Chat -->
  1386. {block:Chat}
  1387. <div class="chat">
  1388. <ul>
  1389. {block:Lines}
  1390. <li class="{Alt}">
  1391. {block:Label}<b>{Label}</b>{/block:Label}
  1392. {Line}
  1393. </li>
  1394. {/block:Lines}
  1395. </ul>
  1396. </div>
  1397. {/block:Chat}
  1398.  
  1399. <!-- Audio -->
  1400. {block:Audio}
  1401. <div class="album">
  1402. {block:AlbumArt}
  1403. <img src="{AlbumArtURL}">
  1404. {block:AlbumArt}
  1405. </div>
  1406. <!--End album-->
  1407. <div class="play">
  1408. {block:AudioPlayer}
  1409. {AudioPlayer}
  1410. {/block:AudioPlayer}
  1411. </div>
  1412. <div class="audio">
  1413. {block:TrackName}<h1>{TrackName}</h1>{/block:TrackName}
  1414. {block:Artist}{Artist}{/block:Artist}<br>
  1415. <!--End play-->
  1416. {block:PlayCount}
  1417. {FormattedPlayCount}
  1418. {/block:PlayCount}
  1419. </div>
  1420. <!--End audio-->
  1421. {/block:Audio}
  1422.  
  1423. <!-- Video -->
  1424. {block:Video}
  1425. <div class="video">{Video-500}</div>
  1426. {/block:Video}
  1427.  
  1428. <!-- Ask -->
  1429. {block:Answer}
  1430. <div class="question">
  1431. <img src="{AskerPortraitURL-48}"
  1432. align="left"></div>
  1433. <div class="questionin">
  1434. {Asker}: {Question}</div>
  1435. <div class="answer">
  1436. {Answer}</div>
  1437. {/block:Answer}
  1438.  
  1439. <!-- Caption -->
  1440. {block:IndexPage}
  1441. {block:IfDisplayCaptions}
  1442. {block:Caption}
  1443. {Caption}
  1444. {/block:Caption}
  1445. {/block:IfDisplayCaptions}
  1446. {/block:IndexPage}
  1447. {block:PermalinkPage}
  1448. {block:Caption}
  1449. {Caption}
  1450. {/block:Caption}
  1451. {/block:PermalinkPage}
  1452.  
  1453. </div>
  1454. <!--End content-->
  1455.  
  1456. <!-- Date -->
  1457. {block:Date}
  1458.  
  1459. <div class="info">
  1460.  
  1461. <big><a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}"> {shortmonth} {dayofmonth} {year}</a>
  1462.  
  1463. {block:NoteCount}
  1464. &bull;
  1465. <a href="{Permalink}">
  1466. {NoteCountWithLabel}</a>
  1467. {/block:NoteCount}
  1468.  
  1469. </big><br>
  1470.  
  1471. <!-- Reblogged from -->
  1472. {block:RebloggedFrom}
  1473. via <a href="{ReblogParentURL}">
  1474. {ReblogParentName}</a>
  1475. {/block:RebloggedFrom}
  1476.  
  1477. {block:ContentSource}
  1478. &bull; source
  1479. <a href="{SourceURL}"
  1480. target=blank> {SourceTitle} </a>
  1481. {/block:ContentSource}
  1482.  
  1483. <!-- Tags -->
  1484. {block:IndexPage}
  1485. {block:IfDisplayTags}
  1486. {block:HasTags}
  1487. <div class="tags">
  1488. <span class="sf sf-tags-o"></span>
  1489. {block:Tags}
  1490. <a href="{TagURL}">{Tag}</a>
  1491. {/block:Tags}
  1492. </div>
  1493. <!-- End tags -->
  1494. {/block:HasTags}
  1495. {/block:IfDisplayTags}
  1496. {/block:IndexPage}
  1497. {block:PermalinkPage}
  1498. {block:HasTags}
  1499. <div class="tags">
  1500. <span class="sf sf-tags-o"></span>
  1501. {block:Tags}
  1502. <a href="{TagURL}">{Tag}</a>
  1503. {/block:Tags}
  1504. </div>
  1505. <!-- End tags -->
  1506. {/block:HasTags}
  1507. {/block:PermalinkPage}
  1508.  
  1509. <!-- Permalink, reblog and like buttons -->
  1510. <ul class="post_buttons">
  1511.  
  1512. <li class="rblg"><a href="{ReblogUrl}"><span class="sf sf-refresh-o"></span></a></li>
  1513.  
  1514. <li class="like">
  1515. <span class="sf sf-heart-o"></span>
  1516. {LikeButton size="15"}
  1517. </li>
  1518.  
  1519. {block:IndexPage}
  1520. <div class="perma"><a href="{Permalink}"><span class="sf sf-aero-cursor-o"></span></a></div>
  1521. {/block:IndexPage}
  1522.  
  1523. </ul>
  1524. <!-- End post_buttons -->
  1525.  
  1526. </div>
  1527. <!--End info-->
  1528. {/block:Date}
  1529.  
  1530. <!-- Permalink page -->
  1531. {block:PermalinkPage}
  1532. <!-- Post notes-->
  1533. {block:PostNotes}
  1534. <div class="postnotes">
  1535. <h2>Post notes:</h2>
  1536. {PostNotes}
  1537. </div>
  1538. {/block:PostNotes}
  1539. {/block:PermalinkPage}
  1540.  
  1541. <!-- Other -->
  1542. {block:ContentSource}
  1543. <!-- {SourceURL}
  1544. {block:SourceLogo}
  1545. <img src="{#000LogoURL}"
  1546. width="{LogoWidth}"
  1547. height="{LogoHeight}"
  1548. alt="{SourceTitle}" />
  1549. {/block:SourceLogo}
  1550. {block:NoSourceLogo}
  1551. {SourceLink}
  1552. {/block:NoSourceLogo} -->
  1553. {/block:ContentSource}
  1554.  
  1555. </div>
  1556. <!--End entry-->
  1557.  
  1558. {/block:Posts}
  1559.  
  1560. </div>
  1561. <!-- End posts -->
  1562.  
  1563. {block:Pagination}
  1564.  
  1565. <div id="pager">
  1566.  
  1567. <div id="pagination">
  1568. {block:PreviousPage}
  1569. <div class="pagicon">
  1570. <a href="{PreviousPage}"><span class="sf sf-arrow-left"></span> NEWER </a>
  1571. </div>
  1572. {/block:PreviousPage}
  1573.  
  1574. <div class="pagicon">
  1575. <a href="#"><span class="sf sf-arrow-up"></span> TOP </a>
  1576. </div>
  1577.  
  1578. {block:NextPage}
  1579. <a class="next" href="{NextPage}"> OLDER <span class="sf sf-arrow-right"></span></a>
  1580. {/block:NextPage}
  1581. </div>
  1582. <!--End pagination-->
  1583.  
  1584. <div id="iscroll">
  1585. {block:ifLoadMore}
  1586. <span class="pagicon">
  1587. <a href="#"><span class="sf sf-arrow-up"></span> TOP </a>
  1588. </span>
  1589.  
  1590. <a href="#" class="load-more"> MORE <span class="sf sf-plus-o"></span></a>
  1591. {/block:ifLoadMore}
  1592. </div>
  1593.  
  1594. </div>
  1595. <!--End pager-->
  1596.  
  1597. {/block:Pagination}
  1598.  
  1599. </div>
  1600. <!--End container-->
  1601.  
  1602. <!-- CREDIT (DO NOT REMOVE) -->
  1603. <div id="credit"><a href="https://www.hunterthemes.tumblr.com">
  1604. <img src="https://66.media.tumblr.com/b29d8873c09628252057b9408a7c4a88/tumblr_plbuq65td51uo5urho1_100.png" title="theme by hunter themes"></a></div>
  1605.  
  1606. </body>
  1607.  
  1608. <!------------------------------ SCRIPTS ------------------------------>
  1609.  
  1610. <!-- Saturn icons font -->
  1611.  
  1612. <link href="//dl.dropbox.com/s/50g6fbds3rh4m0j/saturnicons.css" rel="stylesheet">
  1613.  
  1614. <!--Jquery-->
  1615.  
  1616. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1617.  
  1618. <!-- Style my tooltips -->
  1619.  
  1620. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  1621.  
  1622. <script>
  1623. (function($){
  1624. $(document).ready(function(){
  1625. $("a[title]").style_my_tooltips({
  1626. tip_follows_cursor:true,
  1627. tip_delay_time: 90,
  1628. tip_fade_speed: 600,
  1629. attribute:"title"
  1630. });
  1631. });
  1632. })(jQuery);
  1633. </script>
  1634.  
  1635. <script>
  1636. $(function(){
  1637. $("#main-links a").each(function(){
  1638. if ($(this).attr("href") == window.location.pathname){
  1639. $(this).addClass("selected");
  1640. }
  1641. });
  1642. });
  1643. </script>
  1644.  
  1645. <script>
  1646. $(document).ready(function(){
  1647.  
  1648. $("#open-sidebar").click(function(){
  1649. $("#sidebar").fadeToggle(100);
  1650. $("#open-sidebar").toggleClass('selected')
  1651. });
  1652.  
  1653. $("#close-sidebar").click(function(){
  1654. $("#sidebar").fadeToggle(100);
  1655. $("#open-sidebar").removeClass('selected')
  1656. });
  1657.  
  1658. $("#open-search").click(function(){
  1659. $("#search-panel").fadeToggle(100);
  1660. $("#open-search").toggleClass('selected')
  1661. });
  1662.  
  1663. $("#close-search").click(function(){
  1664. $("#search-panel").fadeToggle(100);
  1665. $("#open-search").removeClass('selected')
  1666. });
  1667.  
  1668. });
  1669. </script>
  1670.  
  1671. <!-- Minimal soundcloud player by @shythemes -->
  1672.  
  1673. <script>
  1674. $(document).ready(function(){
  1675. var color = '#acd7bb'; // color of play button (hex)
  1676. $('.soundcloud_audio_player').each(function(){
  1677. $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=true&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 116, width: '100%' });
  1678. });
  1679. });
  1680. </script>
  1681.  
  1682. <!-- Resize videos by @shythemes -->
  1683.  
  1684. </script><script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  1685.  
  1686. <!-- PXU photoset & responsive photosets -->
  1687.  
  1688. <link href="//static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  1689. <script src="//static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  1690. <link href="//static.tumblr.com/wupwnyt/qWVoc4phj/resizing.css" rel="stylesheet" type="text/css"/>
  1691.  
  1692. {block:IndexPage}
  1693. <script src="https://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  1694.  
  1695. {block:ifInfiniteScroll}
  1696. <script src="//static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  1697. {/block:ifInfiniteScroll}
  1698.  
  1699. {/block:IndexPage}
  1700.  
  1701. <script>
  1702. $(document).ready(function(){
  1703. $('.photo-slideshow').pxuPhotoset({
  1704. lightbox: true,
  1705. rounded: false,
  1706. gutter: '1px',
  1707. photoset: '.photo-slideshow',
  1708. photoWrap: '.photo-data',
  1709. photo: '.pxu-photo'
  1710. });
  1711. {block:IndexPage}
  1712. var $container = $('#posts');
  1713. $container.masonry({ itemSelector: '.entry' });
  1714. $container.imagesLoaded(function(){
  1715. $container.masonry();
  1716. $container.find('.entry').animate({ opacity: 1, zIndex: 1 });
  1717. });
  1718. {block:ifInfiniteScroll}
  1719. $container.infinitescroll({
  1720. itemSelector: '.entry',
  1721. navSelector: '.pagicon',
  1722. nextSelector: '.next',
  1723. loadingImg: '',
  1724. loadingText: '<em></em>',
  1725. bufferPx: 2000,
  1726. extraScrollPx: 12000,
  1727. errorCallback: function() {
  1728. $('.load-more').fadeOut();
  1729. }
  1730. },
  1731. function( newElements ) {
  1732. var $newElems = $( newElements );
  1733. $newElems.find('.photo-slideshow').pxuPhotoset({
  1734. lightbox: true,
  1735. rounded: false,
  1736. gutter: '1px',
  1737. photoset: '.photo-slideshow',
  1738. photoWrap: '.photo-data',
  1739. photo: '.pxu-photo'
  1740. },
  1741. function(){
  1742. $container.masonry();
  1743. });
  1744. $newElems.imagesLoaded(function(){
  1745. $container.masonry( 'appended', $newElems );
  1746. $newElems.animate({ opacity: 1, zIndex: 1 });
  1747. });
  1748. });
  1749.  
  1750. {block:ifLoadMore}
  1751. $(window).unbind('.infscr');
  1752. $('.load-more').click(function() {
  1753. $container.infinitescroll('retrieve');
  1754. return false
  1755. });
  1756. {/block:ifLoadMore}
  1757.  
  1758. {/block:ifInfiniteScroll}
  1759. {/block:IndexPage}
  1760. });
  1761. </script>
  1762.  
  1763. </html>
  1764.  
  1765. <!-- END HTML -->
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement