Advertisement
oftenwrongthemes

Far Far Away - Theme 9

Jan 26th, 2015
5,341
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.38 KB | None | 0 0
  1. <html>
  2. <head><link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
  3.  
  4. <title>{Title}</title>
  5. <link rel="shortcut icon" href="{Favicon}">
  6. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  7. <meta name="description" content="" />
  8. <meta http-equiv="x-dns-prefetch-control" content="off"/>
  9.  
  10. <script type="text/javascript" src="http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.2.min.js"></script>
  11. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  12.  
  13. <script type="text/javascript">
  14. $(window).load(function () {
  15. $('.container').masonry({
  16. itemSelector : ".posts",
  17. },
  18. function() { $('.container').masonry({ appendedContent: $(this) }); }
  19. );
  20. });
  21. </script>
  22.  
  23. <script src="http://static.tumblr.com/twte3d7/qNulm663d/infinite.js"></script>
  24.  
  25. <script type="text/javascript">
  26. $(window).load(function () {
  27. $('.container').masonry(),
  28. $('.masonryWrap').infinitescroll({
  29. itemSelector : ".posts",
  30. navSelector : "div.navigation",
  31. nextSelector : ".navigation a#next",
  32. bufferPx : 10000,
  33. extraScrollPx: 10000,
  34. loadingImg : "",
  35. loadingText : "",
  36. },
  37. function() { $('.container').masonry({ appendedContent: $(this) });
  38. });
  39. });</script>
  40.  
  41. <!---META TAGS--->
  42.  
  43. <meta name="image:Sidebar" content=""/>
  44. <meta name="color:Background" content="#fff"/>
  45. <meta name="color:Text" content="#777"/>
  46. <meta name="color:Links" content="#000"/>
  47. <meta name="color:Links hover" content="#ccc"/>
  48. <meta name="color:Titles background" content="#eee"/>
  49. <meta name="color:Title" content="#fff"/>
  50. <meta name="color:Title shadow" content="#333"/>
  51. <meta name="color:Description box" content="#fff"/>
  52. <meta name="color:Description text" content="#000"/>
  53. <meta name="color:Post info background" content="#fff"/>
  54. <meta name="text:Link 1" content=""/>
  55. <meta name="text:Link 1 url" content=""/>
  56. <meta name="text:Link 2" content=""/>
  57. <meta name="text:Link 2 url" content=""/>
  58. <meta name="text:Link 3" content=""/>
  59. <meta name="text:Link 3 url" content=""/>
  60. <meta name="text:Link 4" content=""/>
  61. <meta name="text:Link 4 url" content=""/>
  62. <meta name="text:Link 5" content=""/>
  63. <meta name="text:Link 5 url" content=""/>
  64. <meta name="if:Three Columns" content="1"/>
  65.  
  66. <style type="text/css">
  67.  
  68. /*GLOBAL*/
  69.  
  70. body {
  71. font-size: 11px;
  72. font-family: georgia, serif;
  73. color: {color:text};
  74. background-color: {color:background};
  75. }
  76.  
  77. a {
  78. color: {color:links};
  79. text-decoration: none;
  80. -moz-transition-duration: 0.5s;
  81. -o-transition-duration: 0.5s;
  82. -webkit-transition-duration: 0.5s;
  83. transition-duration: 0.5s;
  84. }
  85.  
  86. a:hover {
  87. color: {color:links hover};
  88. -moz-transition-duration: 0.5s;
  89. -o-transition-duration: 0.5s;
  90. -webkit-transition-duration: 0.5s;
  91. transition-duration: 0.5s;
  92. }
  93.  
  94. h1 {
  95. text-transform: lowercase;
  96. text-align: center;
  97. font-style: italic;
  98. background: {color:titles background};
  99. padding: 10px;
  100. }
  101.  
  102. h1 a {
  103. color: {color:text};
  104. }
  105.  
  106. h2 {
  107. font-style: italic;
  108. }
  109.  
  110. {block:ifthreecolumns}
  111.  
  112. .container {
  113. width: 900px;
  114. margin-top: 20px;
  115. margin-left: 370px;
  116. }
  117.  
  118. {/block:ifthreecolumns}
  119.  
  120. {block:ifnotthreecolumns}
  121.  
  122. .container {
  123. width: 650px;
  124. margin-top: 20px;
  125. margin-left: 370px;
  126. }
  127.  
  128. {/block:ifnotthreecolumns}
  129.  
  130. .tumblrAutoPager_page_info, .tumblrAutoPager_page_separator {
  131. display:none;
  132. }
  133.  
  134. #infscr-loading {
  135. display:none;
  136. }
  137.  
  138. .navigation {
  139. display:none!important;
  140. }
  141.  
  142. #over{
  143. height:2000px!important;
  144. position:absolute;
  145. top:0px;
  146. left:0px;
  147. width: 100%;
  148. }
  149.  
  150. /*SIDEBAR*/
  151.  
  152. #sidebar {
  153. width: 350px;
  154. background-image:url({image:sidebar});
  155. position: fixed;
  156. left: 0px;
  157. top: 0px;
  158. height: 100%;
  159. }
  160.  
  161. .title {
  162. text-align: right;
  163. font-size: 30px;
  164. color: {color:title};
  165. text-shadow: 2px 2px 2px {color:title shadow};
  166. font-style: italic;
  167. margin-top: 160%;
  168. width: 300px;
  169. -moz-transition-duration: 0.5s;
  170. -o-transition-duration: 0.5s;
  171. -webkit-transition-duration: 0.5s;
  172. transition-duration: 0.5s;
  173. transition-delay: 0.2s;
  174. }
  175.  
  176. #sidebar:hover .title {
  177. opacity: 0;
  178. -moz-transition-duration: 0.5s;
  179. -o-transition-duration: 0.5s;
  180. -webkit-transition-duration: 0.5s;
  181. transition-duration: 0.5s;
  182. }
  183.  
  184. .desc {
  185. background: {color:description box};
  186. text-align: justify;
  187. width: 300px;
  188. padding: 10px;
  189. opacity: 0;
  190. color: {color:description text};
  191. font-style: italic;
  192. text-align: justify;
  193. -moz-transition-duration: 0.5s;
  194. -o-transition-duration: 0.5s;
  195. -webkit-transition-duration: 0.5s;
  196. transition-duration: 0.5s;
  197. }
  198.  
  199. #sidebar:hover .desc {
  200. opacity: .8;
  201. -moz-transition-duration: 0.5s;
  202. -o-transition-duration: 0.5s;
  203. -webkit-transition-duration: 0.5s;
  204. transition-duration: 0.5s;
  205. transition-delay: 0.5s;
  206. }
  207.  
  208. .sblinkscon {
  209. width: 300px;
  210. text-align: center;
  211. opacity: 0;
  212. -moz-transition-duration: 0.5s;
  213. -o-transition-duration: 0.5s;
  214. -webkit-transition-duration: 0.5s;
  215. transition-duration: 0.5s;
  216. padding-top: 10px;
  217. }
  218.  
  219. .sblink {
  220. color: {color:title};
  221. text-transform: uppercase;
  222. font-family: calibri;
  223. font-size: 11px;
  224. text-align: center;
  225. margin-left: 20px;
  226. text-shadow: 1px 1px 1px #555;
  227. }
  228.  
  229. #sidebar:hover .sblinkscon {
  230. opacity: 1;
  231. -moz-transition-duration: 0.5s;
  232. -o-transition-duration: 0.5s;
  233. -webkit-transition-duration: 0.5s;
  234. transition-duration: 0.5s;
  235. transition-delay: 0.5s;
  236. }
  237.  
  238. /*POSTS*/
  239.  
  240. .posts {
  241. {block:IndexPage}width: 250px;{/block:IndexPage}
  242. {block:PermalinkPage}width: 500px;
  243. max-width: 500px;{/block:PermalinkPage}
  244. padding: 20px;
  245. float: left;
  246. }
  247.  
  248. .post {
  249. position: relative;
  250. {block:IndexPage}width: 250px;{/block:IndexPage}
  251. {block:PermalinkPage}width: 500px;
  252. max-width: 500px;{/block:PermalinkPage}
  253. }
  254.  
  255. .border {
  256. border: 1px solid #eee;
  257. padding: 10px;
  258. {block:IndexPage}width: 250px;{/block:IndexPage}
  259. {block:PermalinkPage}width: 500px;{/block:PermalinkPage}
  260. }
  261.  
  262. .posts li {
  263. list-style-type: disc;
  264. }
  265.  
  266. .posts blockquote {
  267. border-left: 1px solid {color:text};
  268. padding-left: 5px;
  269. }
  270.  
  271. .posts img, .posts li, .posts blockquote {
  272. max-width: 100%;
  273. }
  274.  
  275. .question {
  276. text-transform: lowercase;
  277. text-align: center;
  278. font-style: italic;
  279. background: {color:titles background};
  280. padding: 10px;
  281. }
  282.  
  283. .playbutton {
  284. width: 25px;
  285. height: 28px;
  286. padding: 5px;
  287. overflow: hidden;
  288. position: relative;
  289. z-index: 1000
  290. }
  291.  
  292. .playbox {
  293. background-color: #fff;
  294. position: absolute;
  295. z-index: 1000;
  296. margin-top: 17px;
  297. margin-left: 17px;
  298. opacity: .7;
  299. }
  300.  
  301. .audiodesc {
  302. position: relative;
  303. left: 5px;
  304. top: -12px;
  305. font-size: 11px;
  306. }
  307.  
  308. /*POST INFO*/
  309.  
  310. {block:IndexPage}
  311.  
  312. .postinfocon {
  313. background: {color:post info background};
  314. position: absolute;
  315. width: 272px;
  316. display: block;
  317. top: 0px;
  318. left: 0px;
  319. bottom: 0px;
  320. right: 0px;
  321. opacity: 0;
  322. line-height: 115%;
  323. height: 100%;
  324. -moz-transition-duration: 0.5s;
  325. -o-transition-duration: 0.5s;
  326. -webkit-transition-duration: 0.5s;
  327. transition-duration: 0.5s;
  328. }
  329.  
  330. {/block:IndexPage}
  331.  
  332. {block:PermalinkPage}
  333.  
  334. .postinfocon {
  335. display: none;
  336. }
  337.  
  338. {/block:PermalinkPage}
  339.  
  340. .postinfo {
  341. font-size: 17px;
  342. text-align: center;
  343. font-family: 'Open Sans Condensed', sans-serif;
  344. text-transform: uppercase;
  345. top: 45%;
  346. position: relative;
  347. }
  348.  
  349. .post:hover .postinfocon {
  350. opacity: .87;
  351. -moz-transition-duration: 0.5s;
  352. -o-transition-duration: 0.5s;
  353. -webkit-transition-duration: 0.5s;
  354. transition-duration: 0.5s;
  355. }
  356.  
  357. .tags {
  358. padding-top: 5px;
  359. font-size: 13px;
  360. }
  361.  
  362. .postnotes {
  363. line-height: 200%;
  364. text-align: center;
  365. margin-top: 20px;
  366. list-style: none;
  367. width: 500px;
  368. }
  369.  
  370. .postnotes ol.notes {
  371. list-style-type: none;
  372. }
  373.  
  374. .postnotes li {
  375. list-style-type: none;
  376. }
  377.  
  378. .postnotes img.avatar {
  379. width: 0px;
  380. height: 0px;
  381. }
  382.  
  383. /*CREDIT*/
  384.  
  385. .credit {
  386. position: fixed;
  387. bottom: 10px;
  388. right: 12px;
  389. }
  390.  
  391. </style>
  392. </head>
  393.  
  394. <body>
  395.  
  396. <!---INFINITE SCROLL--->
  397.  
  398. <div class="navigation">
  399. {block:Pagination}
  400. {block:NextPage}<p id="page_nav"><a style="float:right" href="{NextPage}" id="next">Older ?</a>{/block:NextPage}
  401. {block:PreviousPage}<a style="float:left" href="{PreviousPage}">? Newer</a></p>{/block:PreviousPage}
  402. {/block:Pagination}
  403. </div>
  404.  
  405. <div id ="over"></div>
  406.  
  407. <!---SIDEBAR--->
  408.  
  409. <div id="sidebar">
  410.  
  411. <div class="title">{Title}</div>
  412.  
  413. <center><div class="desc">{Description}</div>
  414.  
  415. <div class="sblinkscon"><table><tr>
  416. <td><a href="{text:link 1 url}"><div class="sblink">{text:link 1}</div></a></td>
  417. <td><a href="{text:link 2 url}"><div class="sblink">{text:link 2}</div></a></td>
  418. <td><a href="{text:link 3 url}"><div class="sblink">{text:link 3}</div></a></td>
  419. <td><a href="{text:link 4 url}"><div class="sblink">{text:link 4}</div></a></td>
  420. <td><a href="{text:link 5 url}"><div class="sblink">{text:link 5}</div></a></td>
  421. </tr></table></div>
  422.  
  423. </center>
  424.  
  425. </div>
  426.  
  427. <!---POSTS--->
  428.  
  429. <div class="container">
  430. {block:Posts}
  431. <div class="posts">
  432.  
  433. <!---QUESTIONS--->
  434.  
  435. <div class="post">
  436. {block:Answer}<div class="border">
  437. <div class="question">{Asker} asked: {Question}</div>
  438. {Answer}
  439.  
  440. <div class="postinfocon"><div class="postinfo">
  441.  
  442. <a href="{Permalink}">{block:Date} {ShortMonth} {DayOfMonthWithZero}{/block:Date}</a>
  443.  
  444. <a href="{Permalink}" style="padding-left: 3px;">{block:NoteCount}+{NoteCount}{/block:NoteCount}</a>
  445.  
  446. {block:RebloggedFrom}<a href="{ReblogParentURL}" style="padding-left: 3px;">VIA</a>
  447.  
  448. <a href="{ReblogRootURL}" style="padding-left: 3px;">SOURCE</a>{/block:RebloggedFrom}
  449.  
  450. <div class="tags">{block:HasTags} {block:Tags} <a href="/tagged/{TAG}" style="padding-left: 3px;">#{TAG}</a> {/block:Tags} {/block:HasTags}</div>
  451.  
  452. </div></div>
  453. </div>
  454. {/block:Answer}
  455. </div>
  456.  
  457. <!---TEXT--->
  458.  
  459. <div class="post">
  460. {block:Text}<div class="border">
  461. {block:Title}<h1>{Title}</h1>{/block:Title}
  462. {Body}
  463.  
  464. <div class="postinfocon"><div class="postinfo">
  465.  
  466. <a href="{Permalink}">{block:Date} {ShortMonth} {DayOfMonthWithZero}{/block:Date}</a>
  467.  
  468. <a href="{Permalink}" style="padding-left: 3px;">{block:NoteCount}+{NoteCount}{/block:NoteCount}</a>
  469.  
  470. {block:RebloggedFrom}<a href="{ReblogParentURL}" style="padding-left: 3px;">VIA</a>
  471.  
  472. <a href="{ReblogRootURL}" style="padding-left: 3px;">SOURCE</a>{/block:RebloggedFrom}
  473.  
  474. <div class="tags">{block:HasTags} {block:Tags} <a href="/tagged/{TAG}" style="padding-left: 3px;">#{TAG}</a> {/block:Tags} {/block:HasTags}</div>
  475.  
  476. </div></div>
  477.  
  478. </div>
  479. {/block:Text}
  480. </div>
  481.  
  482. <!---QUOTE--->
  483.  
  484. <div class="post">
  485.  
  486. {block:Quote}<div class="border">
  487. <h2>{Quote}</h2>
  488. {block:Source}<div align="center">{Source}</div>{/block:Source}
  489.  
  490. <div class="postinfocon"><div class="postinfo">
  491.  
  492. <a href="{Permalink}">{block:Date} {ShortMonth} {DayOfMonthWithZero}{/block:Date}</a>
  493.  
  494. <a href="{Permalink}" style="padding-left: 3px;">{block:NoteCount}+{NoteCount}{/block:NoteCount}</a>
  495.  
  496. {block:RebloggedFrom}<a href="{ReblogParentURL}" style="padding-left: 3px;">VIA</a>
  497.  
  498. <a href="{ReblogRootURL}" style="padding-left: 3px;">SOURCE</a>{/block:RebloggedFrom}
  499.  
  500. <div class="tags">{block:HasTags} {block:Tags} <a href="/tagged/{TAG}" style="padding-left: 3px;">#{TAG}</a> {/block:Tags} {/block:HasTags}</div>
  501.  
  502. </div></div>
  503.  
  504. </div>
  505. {/block:Quote}
  506.  
  507. </div>
  508.  
  509. <!---LINK--->
  510.  
  511. <div class="post">
  512.  
  513. {block:Link}<div class="border">
  514. <h1><a href="{URL}">{Name}</a></h1>
  515. {block:Description}{Description}{/block:Description}
  516.  
  517. <div class="postinfocon"><div class="postinfo">
  518.  
  519. <a href="{Permalink}">{block:Date} {ShortMonth} {DayOfMonthWithZero}{/block:Date}</a>
  520.  
  521. <a href="{Permalink}" style="padding-left: 3px;">{block:NoteCount}+{NoteCount}{/block:NoteCount}</a>
  522.  
  523. {block:RebloggedFrom}<a href="{ReblogParentURL}" style="padding-left: 3px;">VIA</a>
  524.  
  525. <a href="{ReblogRootURL}" style="padding-left: 3px;">SOURCE</a>{/block:RebloggedFrom}
  526.  
  527. <div class="tags">{block:HasTags} {block:Tags} <a href="/tagged/{TAG}" style="padding-left: 3px;">#{TAG}</a> {/block:Tags} {/block:HasTags}</div>
  528.  
  529. </div></div>
  530.  
  531. </div>
  532. {/block:Link}
  533.  
  534. </div>
  535.  
  536. <!---PHOTO---->
  537.  
  538. <div class="post">
  539. {block:Photo}<div class="border">
  540. {LinkOpenTag}
  541.  
  542. {block:IndexPage}<img src="{PhotoURL-250}" alt="{PhotoAlt}">{/block:IndexPage}
  543. {block:PermalinkPage}<img src="{PhotoURL-500}" alt="{PhotoAlt}">{/block:PermalinkPage}
  544.  
  545. {LinkCloseTag}
  546.  
  547. {block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}
  548.  
  549. <div class="postinfocon"><div class="postinfo">
  550.  
  551. <a href="{Permalink}">{block:Date} {ShortMonth} {DayOfMonthWithZero}{/block:Date}</a>
  552.  
  553. <a href="{Permalink}" style="padding-left: 3px;">{block:NoteCount}+{NoteCount}{/block:NoteCount}</a>
  554.  
  555. {block:RebloggedFrom}<a href="{ReblogParentURL}" style="padding-left: 3px;">VIA</a>
  556.  
  557. <a href="{ReblogRootURL}" style="padding-left: 3px;">SOURCE</a>{/block:RebloggedFrom}
  558.  
  559. <div class="tags">{block:HasTags} {block:Tags} <a href="/tagged/{TAG}" style="padding-left: 3px;">#{TAG}</a> {/block:Tags} {/block:HasTags}</div>
  560.  
  561. </div></div>
  562. </div>
  563.  
  564. {/block:Photo}</div>
  565.  
  566. <!---PHOTOSET--->
  567.  
  568. <div class="post">
  569. {block:Photoset}<div class="border">
  570. {block:IndexPage}{Photoset-250}{/block:IndexPage}
  571. {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  572. {block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}
  573.  
  574. <div class="postinfocon"><div class="postinfo">
  575.  
  576. <a href="{Permalink}">{block:Date} {ShortMonth} {DayOfMonthWithZero}{/block:Date}</a>
  577.  
  578. <a href="{Permalink}" style="padding-left: 3px;">{block:NoteCount}+{NoteCount}{/block:NoteCount}</a>
  579.  
  580. {block:RebloggedFrom}<a href="{ReblogParentURL}" style="padding-left: 3px;">VIA</a>
  581.  
  582. <a href="{ReblogRootURL}" style="padding-left: 3px;">SOURCE</a>{/block:RebloggedFrom}
  583.  
  584. <div class="tags">{block:HasTags} {block:Tags} <a href="/tagged/{TAG}" style="padding-left: 3px;">#{TAG}</a> {/block:Tags} {/block:HasTags}</div>
  585.  
  586. </div></div>
  587. </div>
  588.  
  589. {/block:Photoset}
  590. </div>
  591.  
  592. <!---AUDIO--->
  593.  
  594. <div class="post">
  595. {block:Audio}<div class="border">
  596. <table><tr><td><div class="playbox"><div class="playbutton">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div></div>
  597. {block:AlbumArt}<img src="{AlbumArtURL}" height="70" width="70">{/block:AlbumArt}</td>
  598. <td><div class="audiodesc">{block:TrackName}<b>Title:</b> {TrackName}<br>{/block:TrackName}{block:Artist}<b>Artist:</b> {Artist}<br>{/block:Artist} {block:Album}<b>Album:</b> {Album}<br>{/block:Album}</div></td></tr></table>{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}
  599.  
  600. <div class="postinfocon"><div class="postinfo">
  601.  
  602. <a href="{Permalink}">{block:Date} {ShortMonth} {DayOfMonthWithZero}{/block:Date}</a>
  603.  
  604. <a href="{Permalink}" style="padding-left: 3px;">{block:NoteCount}+{NoteCount}{/block:NoteCount}</a>
  605.  
  606. {block:RebloggedFrom}<a href="{ReblogParentURL}" style="padding-left: 3px;">VIA</a>
  607.  
  608. <a href="{ReblogRootURL}" style="padding-left: 3px;">SOURCE</a>{/block:RebloggedFrom}
  609.  
  610. <div class="tags">{block:HasTags} {block:Tags} <a href="/tagged/{TAG}" style="padding-left: 3px;">#{TAG}</a> {/block:Tags} {/block:HasTags}</div>
  611.  
  612. </div></div>
  613.  
  614. </div>
  615. {/block:Audio}
  616. </div>
  617.  
  618. <!---VIDEO--->
  619.  
  620. <div class="post">
  621. {block:Video}<div class="border">
  622. {block:IndexPage}{Video-250}{/block:IndexPage}
  623. {block:PermalinkPage}{Video-500}{/block:PermalinkPage}
  624. {block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}
  625.  
  626. <div class="postinfocon"><div class="postinfo">
  627.  
  628. <a href="{Permalink}">{block:Date} {ShortMonth} {DayOfMonthWithZero}{/block:Date}</a>
  629.  
  630. <a href="{Permalink}" style="padding-left: 3px;">{block:NoteCount}+{NoteCount}{/block:NoteCount}</a>
  631.  
  632. {block:RebloggedFrom}<a href="{ReblogParentURL}" style="padding-left: 3px;">VIA</a>
  633.  
  634. <a href="{ReblogRootURL}" style="padding-left: 3px;">SOURCE</a>{/block:RebloggedFrom}
  635.  
  636. <div class="tags">{block:HasTags} {block:Tags} <a href="/tagged/{TAG}" style="padding-left: 3px;">#{TAG}</a> {/block:Tags} {/block:HasTags}</div>
  637.  
  638. </div></div>
  639. </div>
  640.  
  641. {/block:Video}
  642. </div>
  643.  
  644. {block:PostNotes}<div class="postnotes">{PostNotes}</div>{/block:PostNotes}
  645.  
  646. </div>
  647. {/block:Posts}
  648.  
  649. </div>
  650.  
  651. </body>
  652. <div class="credit"><a href="http://bisexualamy.tumblr.com/">▲▲▲</a></div>
  653. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement