feiinho

Fresh Air

Mar 30th, 2020
730
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!--
  2.  
  3. // {Thm:Revamp}
  4.  
  5. Fresh Air
  6.  
  7. by espoirthemes //
  8.  
  9. + basic html and css knowledge is required to customize this theme
  10. + feel free to edit and custom the theme to your liking,
  11. but don't redistribute, use as a base, or claim as your own
  12. + please do not move or remove the credit
  13.  
  14. Version 2.1
  15. last updated jul. 2018
  16. -->
  17.  
  18. <!DOCTYPE html>
  19. <html>
  20. <head>
  21. <title>{Title}</title>
  22. <link rel="shortcut icon" href="{favicon}">
  23. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  24. {block:Description}
  25. <meta name="description" content="{MetaDescription}" />
  26. {/block:Description}
  27.  
  28. <meta name="image:background" content="" />
  29. <meta name="image:header" content="https://images.unsplash.com/photo-1508108712903-49b7ef9b1df8?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=e8e408ae0aa57c599eea33bdabc0498b&auto=format&fit=crop&w=1650&q=80" />
  30.  
  31. <link href="https://fonts.googleapis.com/css?family=Abril+Fatface|Raleway" rel="stylesheet">
  32.  
  33. <meta name="color:background" content="#f7f7f7" />
  34. <meta name="color:posts" content="#fff" />
  35. <meta name="color:text" content="#222" />
  36. <meta name="color:links" content="#aaa" />
  37. <meta name="color:underline" content="#b8cfe0" />
  38. <meta name="color:border" content="#eee" />
  39. <meta name="color:scrollbar" content="#eee" />
  40. <meta name="color:scrollbar background" content="#f8f8f8" />
  41. <meta name="color:tooltip" content="#000" />
  42. <meta name="color:tooltip text" content="#fff" />
  43. <meta name="color:selection background" content="#ddd" />
  44. <meta name="color:selection text" content="#000" />
  45. <meta name="color:usernames" content="#b5b4df" />
  46. <meta name="color:info links" content="cornflowerblue" />
  47.  
  48. <meta name="color:current page" content="#fff" />
  49. <meta name="color:current page text" content="#444" />
  50. <meta name="color:pagination text" content="#fff" />
  51. <meta name="color:jump page" content="#529ecc" />
  52. <meta name="text:notes" content="breaths" />
  53. <meta name="text:asked" content="shouted" />
  54. <meta name="text:bullet point" content="+" />
  55. <meta name="text:tag symbol" content="#" />
  56.  
  57. <meta name="if:full background" content="" />
  58.  
  59. <link href="//dl.dropbox.com/s/50g6fbds3rh4m0j/saturnicons.css" rel="stylesheet">
  60. <script type="text/javascript" src="https://static.tumblr.com/3ikgvxs/0TGl4zgpu/jquery.min.js"></script>
  61. <script type="text/javascript">
  62. $(document).ready(function(){
  63. $(".links_body").hide();
  64. $(".links_head").click(function(){
  65. $(this).next(".links_body").slideToggle('fast');
  66. });
  67.  
  68. }); </script>
  69.  
  70. <script>
  71.  
  72. $(document).ready(function(){
  73. $('#press').click(function(){
  74. $('.panel').toggleClass('active');
  75. $('#press').toggleClass('sf-apps-o');
  76. $('#press').toggleClass('sf-cross-o');
  77. $('.title').toggleClass('open');
  78. })
  79.  
  80. $('#close').click(function(){
  81. $('.panel').toggleClass('active');
  82. })
  83.  
  84. var targetOffset = $("#container").offset().top - 700;
  85.  
  86. var $w = $(window).scroll(function(){
  87. if ( $w.scrollTop() > targetOffset ) {
  88. $('header').css({"position":"fixed"});
  89. $('header').css({"width":"30%"});
  90. $('.headerimg').css({"width":"60%"});
  91. $('.headerimg').css({"height":"50%"});
  92.  
  93. $('.title').css({"transform":"translate(-20px, 100px)"});
  94. $('aside').css({"height":"110vh"});
  95. $('.descr').css({"display":"none"});
  96.  
  97.  
  98. } else {
  99. $('header').css({"position":"relative"});
  100. $('header').css({"width":"100%"});
  101. $('.headerimg').css({"width":"60%"});
  102. $('.headerimg').css({"height":"80%"});
  103.  
  104. $('.title').css({"transform":"translate(0,0)"});
  105. $('aside').css({"height":"0px"});
  106. $('.descr').css({"display":"block"});
  107. }
  108. });
  109.  
  110. });
  111.  
  112.  
  113. </script>
  114.  
  115.  
  116. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  117.  
  118.  
  119.  
  120. </head>
  121.  
  122. <style type="text/css">
  123.  
  124. ::selection {
  125. background: {color:selection background}; /* WebKit/Blink Browsers */color:{color:selection text};
  126. }
  127. ::-moz-selection {
  128. background: {color:selection background}; /* Gecko Browsers */color:{color:selection text};
  129. }
  130.  
  131. ::-webkit-scrollbar {
  132. width: 10px;
  133. height:10px;
  134.  
  135. }
  136. ::-webkit-scrollbar-button {
  137. width: 0px;
  138. height: 0px;
  139. }
  140. ::-webkit-scrollbar-thumb {
  141. background: {color:scrollbar};
  142.  
  143. border-radius: 2px;
  144. }
  145. ::-webkit-scrollbar-track {
  146. background:{color:scrollbar background};
  147. border: 4px solid {color:background};
  148.  
  149.  
  150. }
  151.  
  152.  
  153. .tmblr-iframe.tmblr-iframe--desktop-logged-in-controls.iframe-controls--desktop
  154. { white-space:nowrap; -webkit-filter: invert(100%); -moz-filter: invert(100%); filter: invert(100%); opacity:0.8; z-index:99999; top:2px; right:2px;}
  155.  
  156.  
  157.  
  158.  
  159.  
  160. body{
  161. margin:0;
  162. background:{color:background} url({image:background})
  163. {block:iffullbackground} no-repeat center center fixed;
  164. -webkit-background-size: cover;
  165. -moz-background-size: cover;
  166. -o-background-size: cover;
  167. background-size: cover; {/block:iffullbackground};
  168. background-attachment:fixed;
  169. word-wrap:break-word;
  170. font-family:Raleway;
  171. font-size:16.2px;
  172. color:{color:text};
  173. line-height:160%;
  174. overflow-x:hidden;
  175. }
  176.  
  177. a{
  178. color:{color:links};
  179. text-decoration:none;
  180. transition:.6s;
  181. }
  182.  
  183. a:hover {
  184. color:{color:link hover};
  185. transition:.6s;
  186. }
  187.  
  188.  
  189. li {
  190. list-style:none;
  191. }
  192.  
  193. .posts li:before {
  194. content:'{text:bullet point} ';
  195. }
  196.  
  197.  
  198. blockquote{border-left:2px dotted #b5b4df; padding-left:4px;}
  199. blockquote img{max-width:100%;}
  200.  
  201. #container {
  202. width:70%;
  203. margin:100px auto;
  204.  
  205. position:relative;
  206.  
  207. }
  208. ol.notes {
  209. line-height:200%;
  210. }
  211.  
  212. .posts, ol.notes{
  213. width:44%;
  214. position:relative;
  215. margin:50vh auto;
  216. {block:permalinkpage}
  217. margin:50px auto;
  218. {/block:permalinkpage}
  219. break-inside:avoid;
  220. }
  221. .posts img {
  222. max-width:100%;
  223. box-shadow:6px 6px 40px rgba(0,0,0,.06);
  224. border-radius:8px;
  225. }
  226.  
  227.  
  228. .posts iframe {
  229. box-shadow:6px 6px 40px rgba(0,0,0,.06);
  230. border-radius:8px;
  231. }
  232. .caption {
  233. position:relative;
  234. width:calc(100% - 40px);
  235. margin-top:8px;
  236. padding:20px;
  237. background:{color:posts};
  238. border-radius:8px;
  239. }
  240.  
  241. .reblog-content a {
  242. border-bottom:2px solid {color:underline};
  243.  
  244. }
  245.  
  246.  
  247. .user, .tumblr_blog, .deactivated, .tumblelog, ol.notes .like .action a {
  248. margin:6px;
  249. margin-left:20px;
  250. padding:4px;
  251. border-radius:4px;
  252. border:none;
  253. position:relative;
  254. background:rgba({RGBcolor:usernames}, .12)
  255. }
  256.  
  257. .user:after, .tumblr_blog:after, .deactivated:after, .tumblelog:after, ol.notes .like .action a:after
  258. {
  259. content: '';
  260. position: absolute;
  261. border-style: solid;
  262. border-width: 8px 13px 8px 0;
  263. border-color: transparent rgba({RGBcolor:usernames}, .12); /* keep same color as bubble */
  264. display: block;
  265. width: 0;
  266. z-index: 1;
  267. left: -13px;
  268. top: 6px;
  269. }
  270.  
  271.  
  272.  
  273. h1{ padding:20px; margin-top:2px; font-size:18px; text-align:center; padding-bottom:30px; position:relative;}
  274.  
  275. .info {
  276. position: relative;
  277. text-align: center;
  278. transition: .6s;
  279.  
  280.  
  281. padding: 8px;
  282. }
  283. .info a {
  284. color:{color:info links};
  285. margin:6px;
  286. }
  287.  
  288. .posts:hover .info {
  289.  
  290. opacity:1;
  291. transition:.6s
  292.  
  293. }
  294.  
  295. .reblob {
  296. position:absolute;
  297. opacity:0;
  298. top:60px;
  299. right:-60px;
  300. background:{color:posts};
  301. transition:.6s;
  302. font-size:.92em;
  303. font-size:22px;
  304. padding:8px 10px 4px 10px;
  305.  
  306.  
  307. border-radius:100%;
  308.  
  309. width:20px;
  310.  
  311. transform: translate3d(30px,-52px,50px);
  312. }
  313.  
  314. .likey {
  315. position:absolute;
  316. opacity:0;
  317. top:120px;
  318. right:-60px;
  319. background:{color:posts};
  320. transition:.6s;
  321. font-size:.92em;
  322. font-size:22px;
  323. padding:8px 10px 4px 10px;
  324.  
  325.  
  326. border-radius:100%;
  327.  
  328. width:20px;
  329.  
  330. transform: translate3d(30px,-52px,50px);
  331. }
  332.  
  333.  
  334. .reblob a {
  335. color:gray;
  336. }
  337. .posts:hover .reblob, .posts:hover .likey {
  338. transform: translate3d(0px,-52px,0px);
  339. opacity:1;
  340. transition:.6s
  341.  
  342. }
  343.  
  344. .tags {
  345. position:relative;
  346.  
  347. }
  348.  
  349.  
  350. .tag {
  351. text-align:center;
  352. font-size:.92em;
  353. }
  354.  
  355.  
  356.  
  357.  
  358. #description {
  359.  
  360. left:240px;
  361. top:100px;
  362. width:180px;
  363.  
  364. position:fixed;
  365. }
  366.  
  367. #description li {
  368. list-style:none;
  369. border:1px solid {color:border};
  370. padding:6px;
  371. margin:4px 0px 0px 0px;
  372. background:{color:posts};
  373. }
  374.  
  375.  
  376.  
  377. .links_body li:first-child:after
  378. {
  379. content: '';
  380. position: absolute;
  381. border-style: solid;
  382. border-width: 0 15px 15px;
  383. border-color: {color:posts} transparent;
  384. display: block;
  385. width: 0;
  386. z-index: 1;
  387. margin-top:-40px;
  388. left:20%;
  389. }
  390. .links_body li:first-child:before
  391. {
  392. content: '';
  393. position: absolute;
  394. border-style: solid;
  395. border-width: 0 15px 15px;
  396. border-color: {color:border} transparent;
  397. display: block;
  398. width: 0;
  399. z-index: 0;
  400. margin-top:-22px;
  401. left: 20%;
  402. }
  403.  
  404. #description:after
  405. {
  406. content: '';
  407. position: absolute;
  408.  
  409.  
  410. border-style: solid;
  411. border-width: 12px 17px 12px 0;
  412. border-color: transparent {color:posts};
  413. display: block;
  414. width: 0;
  415. z-index: 1;
  416. left: -14px;
  417. top: 23px;
  418. }
  419.  
  420. #description:before
  421. {
  422.  
  423. content: '';
  424. position: absolute;
  425. border-style: solid;
  426. border-width: 12px 17px 12px 0;
  427. border-color: transparent {color:border};
  428. display: block;
  429. width: 0;
  430. z-index: 0;
  431. left: -16px;
  432. top: 23px;
  433. }
  434.  
  435. #sidebar li {
  436. list-style:none;
  437. padding:6px;
  438. margin:2px 0px 0px 0px;
  439. background:{color:posts};
  440. }
  441.  
  442. .speechbubble
  443. {
  444. width:70%;
  445. position: relative;
  446. background:#eee;
  447. left:80px;
  448. margin: 0;
  449. font-size:14px;
  450. padding:20px;
  451. height: auto;
  452. background: #FFFFFF;
  453. -webkit-border-radius: 2px;
  454. -moz-border-radius: 2px;
  455. border-radius: 2px;
  456. border: {color:border} solid 1px;
  457. }
  458.  
  459. .speechbubble:after
  460. {
  461. content: '';
  462. position: absolute;
  463.  
  464.  
  465. border-style: solid;
  466. border-width: 12px 17px 12px 0;
  467. border-color: transparent #FFFFFF;
  468. display: block;
  469. width: 0;
  470. z-index: 1;
  471. left: -17px;
  472. top: 23px;
  473. }
  474.  
  475. .speechbubble:before
  476. {
  477.  
  478. content: '';
  479. position: absolute;
  480. border-style: solid;
  481. border-width: 12px 17px 12px 0;
  482. border-color: transparent {color:border};
  483. display: block;
  484. width: 0;
  485. z-index: 0;
  486. left: -18px;
  487. top: 23px;
  488. }
  489. .speechbubble2
  490. {
  491. position: relative;
  492. background:#eee;
  493. font-size:14px;
  494. text-align:left;
  495. height: auto;
  496. background: #FFFFFF;
  497. -webkit-border-radius: 2px;
  498. -moz-border-radius: 2px;
  499. border-radius: 2px;
  500. border: {color:border} solid 1px;
  501. width:70%;
  502. left:30px;
  503. color:{color:ask post text};
  504. margin: 0;
  505. padding:10px;
  506. text-align:right;
  507.  
  508. }
  509.  
  510. .speechbubble2:after
  511. {
  512. content: '';
  513. position:absolute;
  514. border-style: solid;
  515. border-width: 10px 0 10px 17px;
  516. border-color: transparent #FFFFFF;
  517. display: block;
  518. width: 0;
  519. z-index: 1;
  520. right: -17px;
  521. top: 10px;
  522. }
  523.  
  524. .speechbubble2:before
  525. {
  526. content: '';
  527. position: absolute;
  528. border-style: solid;
  529. border-width: 10px 0 10px 17px;
  530. border-color: transparent {color:border};
  531. display: block;
  532. width: 0;
  533. z-index: 0;
  534. right: -18px;
  535. top: 10px;
  536. }
  537.  
  538.  
  539. #albumart{
  540. z-index:2;
  541.  
  542. width:90px;
  543. float:left;border-radius:100%;
  544. height:90px;
  545.  
  546. border:1px solid {color:border};
  547.  
  548. }
  549.  
  550. .playerbox {
  551. float:left;
  552. padding:6px;
  553. }
  554.  
  555.  
  556. #albumart img{
  557.  
  558. width:90px;
  559. height:90px;
  560. float:left;border-radius:100%;
  561.  
  562.  
  563.  
  564. border-width:0px; transition:.6s;
  565.  
  566. }
  567.  
  568. .playerbox:hover #albumart img{
  569. transition:0.6s;
  570. transform:rotate(300deg); }
  571.  
  572. .player {
  573. max-width:20px;
  574. overflow:hidden;
  575. max-height:40px;
  576. transform:scale(1.16);
  577. border-radius:100%;
  578.  
  579. top:8px;
  580. bottom:10px;
  581. left:0px;
  582.  
  583. padding:8px;
  584. padding-top:6px;
  585. padding-left:10px;
  586. padding-bottom:0px;
  587. border-radius:100%;
  588. position:absolute;
  589.  
  590.  
  591. }
  592.  
  593.  
  594. .playercon {
  595. width:56px;
  596. height:56px;
  597. border-radius:100%;
  598. left:0px;
  599. background:#f2f2f2;
  600. top:16px;
  601. position:relative;
  602. -webkit-transition-duration:500ms;
  603. -moz-transition-duration:500ms;
  604. -o-transition-duration:500ms;
  605. -ms-transition-duration:500ms;
  606. }
  607.  
  608. .infobox {
  609. float:left top;
  610. margin-left:120px;
  611. background-color:transparent;
  612. padding:14px;
  613. padding-left:2px;
  614. max-height:140px;
  615.  
  616. color:{color:text};
  617. }
  618.  
  619. .track {
  620.  
  621. font-size:16px;
  622. letter-spacing:2px;
  623.  
  624. padding:2px;
  625. font-weight:300;
  626. text-transform:uppercase; transition:.6s;
  627. color:#333;
  628.  
  629.  
  630. }
  631. .artist {
  632. letter-spacing:2px;
  633. padding:2px;
  634. font-size:14px;
  635. font-style:italic;
  636.  
  637.  
  638.  
  639. }
  640.  
  641. .album {
  642. font-size:12px;
  643.  
  644. }
  645.  
  646. .playcount {
  647. font-size:12px;
  648.  
  649. text-transform:uppercase;
  650. letter-spacing:3px;
  651. }
  652.  
  653.  
  654. #audiopost {
  655. padding:10px;
  656. border-radius:8px;
  657. background:{color:posts};
  658.  
  659.  
  660.  
  661. }
  662.  
  663. .linkp{
  664. font-size:24px; text-align:center;
  665.  
  666. }
  667. .linkp a{text-decoration:none; }
  668. .linkp:after{
  669. content:'»';
  670. transition:.6s; margin-left:2px;
  671. }
  672.  
  673. .linkp:hover:after{
  674. margin-left:10px;
  675. transition:.6s;
  676. color:{color:link};
  677.  
  678. }
  679.  
  680.  
  681. .chat {
  682. padding:5px;
  683. line-height:150%;
  684. }
  685.  
  686. .chat:nth-of-type(odd) {
  687. background:{color:text};
  688. color:{color:posts};
  689. -webkit-transition:.5s;
  690. transition:.5s; }
  691.  
  692. .chat:nth-of-type(odd) b {
  693. color:{color:posts};
  694. -webkit-transition:.5s;
  695. transition:.5s; }
  696.  
  697. .chat:nth-of-type(even) {
  698. background:{color:posts};
  699. color:{color:text};
  700. -webkit-transition:.5s;
  701. transition:.5s; }
  702. .chat:nth-of-type(even) b{
  703. color:{color:text};
  704. -webkit-transition:.5s;
  705. transition:.5s; }
  706.  
  707.  
  708.  
  709.  
  710.  
  711. #perma {
  712. position: absolute;
  713. letter-spacing: .5px;
  714. text-transform: lowercase;
  715. margin-top:0px;
  716. margin-left:460px;
  717.  
  718. z-index:99;
  719. opacity:0; transition:.6s;
  720.  
  721. }
  722.  
  723. #perma:before{content:''; position:absolute; width:1px;height:0px; background:{color:border}; margin-left:20px;
  724. ; top:10px; z-index:-1; transition:.6s; }
  725.  
  726. #perma:after {content:''; position:absolute; width:0px;height:1px; background:{color:border}; left:-60px; top:20px; z-index:-1; transition:.6s;
  727.  
  728.  
  729. }
  730.  
  731. #perma img {
  732. border:2px solid {color:border}; margin:6px;
  733. min-width:30px;
  734. }
  735.  
  736. #perma a {
  737. border:none;
  738. }
  739.  
  740. .posts:hover #perma{
  741. opacity:1;
  742. transition-delay:.6s;
  743. transition:2s;
  744.  
  745. }
  746. .posts:hover #perma:before{height:50px; transition:.9s; transition-delay:.6s; ; }
  747. .posts:hover #perma:after{width:100px; transition:.9s;
  748.  
  749. }
  750.  
  751.  
  752.  
  753. #egg { opacity:.8;right:10px; bottom:10px; position:fixed;display:block; width: 14px; height: 18px; background-color:#FFFEFC; -webkit-border-radius: 63px 63px 63px 63px / 108px 108px 72px 72px; border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
  754. font-family: "bitxmap";
  755. border:2px solid #aaa; z-index:99999;
  756.  
  757. }
  758. #egg:hover { animation-name: egg;
  759. animation-duration: 1s;
  760. animation-iteration-count: infinite;}
  761. @keyframes egg{
  762. 0%{}
  763. 10%{transform:rotate(20deg)}
  764. 80%{transform:rotate(-20deg)}
  765. 100%{}
  766. }
  767.  
  768.  
  769. header {
  770. position:fixed;
  771. width:30%;
  772. left:0px;
  773. top:0px;
  774. height:100vh;
  775.  
  776. width:100%;
  777. height:100vh;
  778.  
  779. position:relative;
  780. z-index:9;
  781. top:0px;
  782. margin:0px auto;
  783.  
  784.  
  785.  
  786. display:flex;
  787. justify-content:center;
  788. align-items:center;
  789. flex-wrap:wrap;
  790. transition:1s;
  791.  
  792.  
  793. }
  794.  
  795. .headerimg {
  796. width:60%;
  797. height:50%;
  798. z-index:9;
  799. background:url({image:header});
  800. position:relative;
  801.  
  802. background-size:auto 100%;
  803. box-shadow:6px 6px 40px rgba(0,0,0,.06);
  804. border-radius:8px;
  805.  
  806. width:60%;
  807. height:80%;
  808.  
  809.  
  810.  
  811. }
  812.  
  813. .title.open {
  814. opacity:0;
  815. transition:.6s;
  816. }
  817.  
  818. .title {
  819. display:none;
  820. transition:.6s;
  821. display:block;
  822. position:absolute;
  823. margin-left:-22%;
  824. font-size:2.2em;
  825. z-index:10;
  826. font-family:Abril Fatface;
  827.  
  828. }
  829.  
  830. #press {
  831. position:absolute;
  832. color:white;
  833. right:20px;
  834. cursor:pointer;
  835. z-index:99;
  836. transition:.6s;
  837. font-size:1.2em;
  838. top:20px;
  839. }
  840. .panel {
  841. width:calc(100% - 40px);
  842. padding:20px;
  843. background:rgba(0,0,0,.18);
  844. position:absolute;
  845. height:calc(100% - 40px);
  846. opacity:0;
  847. font-family:Raleway!important;
  848. color:white;
  849. font-size:1.2em;
  850. transition:.6s;
  851. z-index:9;
  852. }
  853.  
  854. .panel a {
  855. color:white;
  856. }
  857.  
  858. .panel.active {
  859.  
  860. opacity:1;
  861. }
  862. .panel li{
  863. list-style:none;
  864. margin:14px 0;
  865. padding-left:40px;
  866. counter-increment: menu;
  867.  
  868. }
  869.  
  870. .panel li:before {
  871. content: "0" counter(menu) " ";
  872. font-family:sans-serif;
  873. font-size:.8em;
  874. border-bottom:1px solid {color:underline};
  875. transform:translate(-24px, 0px);
  876. position:absolute;
  877.  
  878.  
  879.  
  880. }
  881.  
  882. /** Pagination **/
  883.  
  884. #pagination {
  885. margin: -40px auto 100px auto;
  886. left: 0;
  887. right: 0;
  888.  
  889. z-index:99999;
  890. text-align: center;
  891. position: relative;
  892.  
  893. width: 100%;
  894.  
  895. display:block;
  896.  
  897. }
  898.  
  899.  
  900. #pagination a, .jump_page, .current_page {
  901. margin: 0 4px;
  902. display: inline-block;
  903. width: 40px;
  904. height: 40px;
  905. text-align: center;
  906. background: {color:jump page};
  907. border-radius: 100%;
  908. color:{color:pagination text};
  909. line-height: 42px;
  910.  
  911. }
  912.  
  913. .currentpage {
  914. background: {color:jump page};
  915. color:{color:pagination text};
  916. padding:10px;
  917. margin:10px;
  918. border-radius:30px;
  919. }
  920.  
  921. .current_page {
  922. background: {color:current page};
  923. color:{color:current page text};
  924. }
  925.  
  926. </style>
  927. <body>
  928. <aside></aside>
  929. <header>
  930.  
  931. <div class="title">{Title}
  932. <p class="descr" style="font-family:raleway; margin-top:8px; font-size:.52em; width:400px">
  933. {Description}
  934.  
  935. </div>
  936.  
  937. <div class="headerimg">
  938. <div class="button">
  939. <a id="press" class="sf sf-apps-o"></a>
  940. <div class="panel">
  941. <li><a href="/">Home</a></li>
  942. {block:AskEnabled}
  943. <li><a href="/ask">Ask</a></li>
  944. {/block:AskEnabled}
  945. {block:SubmissionsEnabled}
  946. <li><a href="/submit">Submit</a> </li>
  947. {/block:SubmissionsEnabled}
  948.  
  949. <li><a href="/archive">Archive</a></li> {Block:HasPages} {block:Pages}<li> <a href="{URL}">{Label}</a></li> {/block:Pages} {/block:HasPages}
  950. </div>
  951.  
  952. </div>
  953. </div>
  954.  
  955.  
  956. </header>
  957.  
  958.  
  959.  
  960.  
  961. <a href="http://espoirthemes.tumblr.com" title="credit"><div id="egg"></div></a>
  962.  
  963. <div id="container">
  964.  
  965. {block:searchpage}<div class="caption">
  966. {lang:SearchResultCount results for SearchQuery}</div>
  967. {/block:searchpage}
  968.  
  969. {block:NoSearchResults} <div class="caption">
  970. {lang:No posts containing SearchQuery}</div>
  971. {/block:NoSearchResults}
  972.  
  973. {block:TagPage}<div class="caption">
  974. {lang:Showing TagResultCount posts tagged Tag}</div>
  975. {/block:TagPage}
  976.  
  977. {block:Posts}<div class="posts">
  978.  
  979.  
  980.  
  981. <!-- {block:NoRebloggedFrom}
  982. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  983. {/block:NoRebloggedFrom} -->
  984. {block:ContentSource}
  985. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  986. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  987. {/block:SourceLogo}
  988. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  989. {/block:ContentSource}
  990. {block:Text}
  991.  
  992. {block:Title}
  993. <h3><a href="{Permalink}">{Title}</a></h3>
  994. {/block:Title}
  995.  
  996.  
  997. <div class="caption"> {block:NotReblog}
  998. <figcaption>
  999. {Body}
  1000. </figcaption>
  1001. {/block:NotReblog}
  1002.  
  1003. {block:RebloggedFrom}
  1004. <div class="reblog-list">
  1005. {block:Reblogs}
  1006. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  1007. <div class="reblog-header">
  1008.  
  1009. {block:IsActive}
  1010. <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank">
  1011. <img src="{PortraitURL-64}" style="width:24px; float:left">
  1012. </a>
  1013. {/block:IsActive}
  1014.  
  1015. {block:IsDeactivated}
  1016. <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}">
  1017. <img src="{PortraitURL-64}" style="width:24px; float:left">
  1018. </span>
  1019. {/block:IsDeactivated}
  1020.  
  1021. {block:IsActive}
  1022. <a target="_blank" href="{Permalink}" class="user">{Username}</a>
  1023. {/block:IsActive}
  1024.  
  1025. {block:IsDeactivated}
  1026. <span class="inactive deactivated">{Username}</span>
  1027. {/block:IsDeactivated}
  1028.  
  1029. </div>
  1030. <div class="reblog-content">
  1031. {Body}
  1032. </div>
  1033. </div>
  1034. {/block:Reblogs}
  1035. </div>
  1036. {/block:RebloggedFrom}</div>
  1037.  
  1038.  
  1039. {/block:Text}{block:Photo}
  1040. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>
  1041.  
  1042. {block:Caption}
  1043. <div class="caption"> {block:NotReblog}
  1044. <figcaption>
  1045. {Caption}
  1046. </figcaption>
  1047. {/block:NotReblog}
  1048.  
  1049. {block:RebloggedFrom}
  1050. <div class="reblog-list">
  1051. {block:Reblogs}
  1052. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  1053. <div class="reblog-header">
  1054.  
  1055. {block:IsActive}
  1056. <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank">
  1057. <img src="{PortraitURL-64}" style="width:24px; float:left">
  1058. </a>
  1059. {/block:IsActive}
  1060.  
  1061. {block:IsDeactivated}
  1062. <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}">
  1063. <img src="{PortraitURL-64}" style="width:24px; float:left">
  1064. </span>
  1065. {/block:IsDeactivated}
  1066.  
  1067. {block:IsActive}
  1068. <a target="_blank" href="{Permalink}" class="user">{Username}</a>
  1069. {/block:IsActive}
  1070.  
  1071. {block:IsDeactivated}
  1072. <span class="inactive deactivated">{Username}</span>
  1073. {/block:IsDeactivated}
  1074.  
  1075. </div>
  1076. <div class="reblog-content">
  1077. {Body}
  1078. </div>
  1079. </div>
  1080. {/block:Reblogs}
  1081. </div>
  1082. {/block:RebloggedFrom}</div>
  1083. {/block:Caption}
  1084. {/block:Photo}{block:Panorama}
  1085.  
  1086. {LinkOpenTag}
  1087. <img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>
  1088. {LinkCloseTag}{block:Caption}
  1089. <div class="caption">{Caption}</div>
  1090. {/block:Caption}
  1091.  
  1092. {/block:Panorama}{block:Photoset}
  1093.  
  1094. {Photoset}
  1095. {block:Caption}
  1096. <div class="caption"> {block:NotReblog}
  1097. <figcaption>
  1098. {Caption}
  1099. </figcaption>
  1100. {/block:NotReblog}
  1101.  
  1102. {block:RebloggedFrom}
  1103. <div class="reblog-list">
  1104. {block:Reblogs}
  1105. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  1106. <div class="reblog-header">
  1107.  
  1108. {block:IsActive}
  1109. <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank">
  1110. <img src="{PortraitURL-64}" style="width:24px; float:left">
  1111. </a>
  1112. {/block:IsActive}
  1113.  
  1114. {block:IsDeactivated}
  1115. <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}">
  1116. <img src="{PortraitURL-64}" style="width:24px; float:left">
  1117. </span>
  1118. {/block:IsDeactivated}
  1119.  
  1120. {block:IsActive}
  1121. <a target="_blank" href="{Permalink}" class="user">{Username}</a>
  1122. {/block:IsActive}
  1123.  
  1124. {block:IsDeactivated}
  1125. <span class="inactive deactivated">{Username}</span>
  1126. {/block:IsDeactivated}
  1127.  
  1128. </div>
  1129. <div class="reblog-content">
  1130. {Body}
  1131. </div>
  1132. </div>
  1133. {/block:Reblogs}
  1134. </div>
  1135. {/block:RebloggedFrom}</div>
  1136. {/block:Caption}
  1137.  
  1138. {/block:Photoset}
  1139.  
  1140. {block:Quote}
  1141.  
  1142. <big> {Quote} </big>
  1143. <br>
  1144. {block:Source}
  1145. -{Source}
  1146. {/block:Source}<br>
  1147. {/block:Quote}
  1148.  
  1149.  
  1150. {block:Link}
  1151. <div class="caption"> <center>
  1152. <a href="{URL}" class="linkp" target="_blank"> {Name}</a>
  1153. </center> </div>
  1154.  
  1155. {block:Description}<div class="caption">
  1156. {Description}</div> {/block:description}
  1157.  
  1158.  
  1159. {/block:Link}
  1160.  
  1161.  
  1162. {block:Chat}
  1163. {block:Title}<a href="{Permalink}" style="background:transparent; padding:0;"><h1>{title}</h1></a>{/block:Title}{block:Lines}<div class="chat">{block:Label}<b>{Label}</b>{/block:Label} {Line}<br/></div>{/block:Lines}
  1164. {/block:Chat}
  1165.  
  1166.  
  1167. {block:Video}
  1168.  
  1169. {Video-400}
  1170.  
  1171. {block:Caption}
  1172. <div class="caption"> {block:NotReblog}
  1173. <figcaption>
  1174. {Caption}
  1175. </figcaption>
  1176. {/block:NotReblog}
  1177.  
  1178. {block:RebloggedFrom}
  1179. <div class="reblog-list">
  1180. {block:Reblogs}
  1181. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  1182. <div class="reblog-header">
  1183.  
  1184. {block:IsActive}
  1185. <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank">
  1186. <img src="{PortraitURL-64}" style="width:24px; float:left">
  1187. </a>
  1188. {/block:IsActive}
  1189.  
  1190. {block:IsDeactivated}
  1191. <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}">
  1192. <img src="{PortraitURL-64}" style="width:24px; float:left">
  1193. </span>
  1194. {/block:IsDeactivated}
  1195.  
  1196. {block:IsActive}
  1197. <a target="_blank" href="{Permalink}" class="user">{Username}</a>
  1198. {/block:IsActive}
  1199.  
  1200. {block:IsDeactivated}
  1201. <span class="inactive deactivated">{Username}</span>
  1202. {/block:IsDeactivated}
  1203.  
  1204. </div>
  1205. <div class="reblog-content">
  1206. {Body}
  1207. </div>
  1208. </div>
  1209. {/block:Reblogs}
  1210. </div>
  1211. {/block:RebloggedFrom}</div>
  1212. {/block:Caption}
  1213.  
  1214. {/block:Video}
  1215. {block:Audio}
  1216. <div id="audiopost">
  1217. <div class="playerbox">
  1218. <div id="albumart"> {block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}</div>
  1219.  
  1220. <center><div class="playercon"><div class="player">{AudioPlayerWhite}</div></div></center></div>
  1221. <div class="infobox">
  1222. <div class="track"> {block:TrackName}
  1223. {TrackName}
  1224. {/block:TrackName} </div>
  1225.  
  1226.  
  1227. <div class="artist">
  1228. {block:Artist}{Artist}
  1229. {/block:Artist} </div>
  1230.  
  1231. <div class="album">
  1232. {block:Album}
  1233. {Album}
  1234. {/block:Album}
  1235. </div>
  1236.  
  1237. <div class="playcount">
  1238.  
  1239. {block:PlayCount}{PlayCountWithLabel}{/block:PlayCount}</div>
  1240. </div></div>
  1241.  
  1242. <br>
  1243. {block:Caption}
  1244. <div class="caption"> {block:NotReblog}
  1245. <figcaption>
  1246. {Caption}
  1247. </figcaption>
  1248. {/block:NotReblog}
  1249.  
  1250. {block:RebloggedFrom}
  1251. <div class="reblog-list">
  1252. {block:Reblogs}
  1253. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  1254. <div class="reblog-header">
  1255.  
  1256. {block:IsActive}
  1257. <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank">
  1258. <img src="{PortraitURL-64}" style="width:24px; float:left">
  1259. </a>
  1260. {/block:IsActive}
  1261.  
  1262. {block:IsDeactivated}
  1263. <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}">
  1264. <img src="{PortraitURL-64}" style="width:24px; float:left">
  1265. </span>
  1266. {/block:IsDeactivated}
  1267.  
  1268. {block:IsActive}
  1269. <a target="_blank" href="{Permalink}" class="user">{Username}</a>
  1270. {/block:IsActive}
  1271.  
  1272. {block:IsDeactivated}
  1273. <span class="inactive deactivated">{Username}</span>
  1274. {/block:IsDeactivated}
  1275.  
  1276. </div>
  1277. <div class="reblog-content">
  1278. {Body}
  1279. </div>
  1280. </div>
  1281. {/block:Reblogs}
  1282. </div>
  1283. {/block:RebloggedFrom}</div>
  1284. {/block:Caption}
  1285. {/block:Audio}
  1286.  
  1287.  
  1288. {block:Answer} <br><div class="caption">
  1289. <div class="askerportrait"><img style=" margin-left:0px; position:absolute;" src="{AskerPortraitURL-48}" align="left" /></div><div class="speechbubble">{Asker} {text:asked}: {Question}</div><br>
  1290.  
  1291.  
  1292. {block:Answerer}
  1293.  
  1294.  
  1295. <div class="askerportrait"><img style="right:20px; position:absolute;" src="{AnswererPortraitURL-48}" align="right" /></div><div class="speechbubble2" style="text-align:left;">{Answerer}: {Answer}</div>
  1296. <br>
  1297.  
  1298. {/block:Answerer}
  1299. {block:NotReblog}
  1300. <div class="askerportrait"><img style="right:20px; position:absolute;" src="{PortraitURL-48}" align="right" /> </div><div class="speechbubble2" style="text-align:left">{replies}</div>
  1301. {/block:NotReblog}
  1302. </div>
  1303. {/block:Answer}
  1304.  
  1305. <div class="info">
  1306. {block:Date}
  1307. <a href="{permalink}" title="{timeAgo}">{24HourWithZero}:{Minutes} {CapitalAMPM}</a> <span class="sf sf-cloud-o"></span> <a href="{Permalink}">{NoteCount} {text:notes}</a> {/block:Date}
  1308. </div>
  1309. {block:Date}
  1310. <div class="likey">
  1311. {LikeButton color="gray"}
  1312. </div>
  1313. <div class="reblob">
  1314. <a href="{ReblogURL}" class="sf sf-reblog-o"></a></div> {/block:Date}
  1315.  
  1316. {block:HasTags}<div class="tags"> <div class="tag">{block:tags} <a href="{TagURL}">{text:tag symbol}{Tag}</a>{/block:tags}</div></div> {/block:HasTags}
  1317. </div>
  1318.  
  1319. <!--posts end-->{/block:Posts}
  1320.  
  1321.  
  1322. <center>
  1323. {block:Pagination}
  1324. <div id="pagination">
  1325. {block:previousPage} <span class ="jump_page"><a href="{PreviousPage}"> <span class="sf sf-arrow-left"></span></a></span>{/block:PreviousPage}
  1326.  
  1327. {block:JumpPagination length="5"}
  1328. {block:CurrentPage}
  1329. <span class="current_page sf sf-cloud-o"></span>
  1330. {/block:CurrentPage}
  1331.  
  1332. {block:JumpPage}
  1333. <a class="jump_page" href="{URL}">{PageNumber}</a>
  1334. {/block:JumpPage}
  1335. {/block:JumpPagination}
  1336.  
  1337. {block:NextPage} <span class="jump_page">
  1338. <a href="{NextPage}"> <span class="sf sf-arrow-right"></span> </a>
  1339. </span>{/block:NextPage}
  1340. </div>
  1341. {/block:Pagination}
  1342.  
  1343. {block:DayPagination}{block:PreviousDayPage}
  1344. <a href="{PreviousDayPage}" class="jump_page">
  1345. <span class="sf sf-arrow-left"></span>
  1346. </a>
  1347. {/block:PreviousDayPage}
  1348.  
  1349. {block:PreviousDayPage}
  1350. <span class="currentpage"> Previous: {ShortMonth} {Dayofmonth} </span>
  1351. {/block:PreviousDayPage}
  1352. {block:NextDayPage}
  1353. <span class="currentpage">Next: {ShortMonth} {Dayofmonth} </span>
  1354. {/block:NextDayPage}
  1355. {block:NextDayPage}
  1356. <a href="{NextDayPage}" class="jump_page">
  1357. <span class="sf sf-arrow-right"></span>
  1358. </a>
  1359. {/block:NextDayPage}{/block:DayPagination}
  1360. {block:PermalinkPagination}
  1361. {block:PreviousPost}
  1362. <a href="{PreviousPost}" class="jump_page"><span class="sf sf-arrow-left"></span></a>
  1363. {/block:PreviousPost}
  1364.  
  1365. {block:NextPost}
  1366. <a href="{NextPost}" class="jump_page"><span class="sf sf-arrow-right"></span></a>
  1367. {/block:NextPost}
  1368. {/block:PermalinkPagination} </center>
  1369.  
  1370. {block:PostNotes} {PostNotes} {/block:PostNotes}
  1371. </div><!--container end-->
  1372.  
  1373.  
  1374. </body>
  1375. </html>
Add Comment
Please, Sign In to add comment