Advertisement
kingdap

Timeless

Feb 28th, 2014
1,915
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 33.80 KB | None | 0 0
  1. <!-----------------------------------------------------------------------
  2. Timeless by megidolaon-for-everyone
  3.  
  4. Credits:
  5. Q&A Posts: excolo
  6. Two-Column Code: manatopia
  7. Music Icon: iconfinder
  8. Inspired by: ladmilk
  9.  
  10. Please keep the credits intact! You're free to make changes to the
  11. theme, but only for personal use.
  12.  
  13. ------------------------------------------------------------------------>
  14.  
  15.  
  16. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  17.  
  18. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  19.  
  20. <head>
  21.  
  22. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  23.  
  24. <meta name="image:Background" content="http://31.media.tumblr.com/tumblr_lvuln9WYkZ1r1ne7to10_r1_500.png">
  25. <meta name="image:Sidebar1" content="http://static.tumblr.com/c84a9b8448f965718fdfe675971aaa6d/fp8s385/D23n1n2be/tumblr_static_ta.png">
  26. <meta name="image:Sidebar2" content="http://i.imgur.com/P1se88a.png">
  27. <meta name="image:Sidebar3" content="http://i.imgur.com/ehwv4jZ.png">
  28. <meta name="image:Sidebar4" content="http://i.imgur.com/S94fw0S.png">
  29.  
  30. <meta name="color:Post" content="#fff">
  31. <meta name="color:Blockquote BG" content="#e6e6e6">
  32. <meta name="color:Background" content="#000">
  33. <meta name="color:Post Border" content="#e4e4de">
  34. <meta name="color:Text" content="#949494">
  35. <meta name="color:Link" content="#474746">
  36. <meta name="color:Link Hover" content="#d9e0e3">
  37. <meta name="color:Link Hover BG" content="#fff">
  38. <meta name="color:Link Hover Border" content="#ccc">
  39. <meta name="color:Link Hover Text" content="#646161">
  40. <meta name="color:Emphasis Text" content="#686868">
  41.  
  42. <meta name="color:Sidebar 1 Border" content="#919090">
  43. <meta name="color:Sidebar 2 Border" content="#3f3f3f">
  44. <meta name="color:Sidebar 3 Border" content="#3f3f3f">
  45. <meta name="color:Sidebar 4 Border" content="#919090">
  46. <meta name="color:Sidebar Link" content="#8d8b8b">
  47. <meta name="color:Sidebar Link Hover" content="#83c3dc">
  48. <meta name="color:Sidebar Link BG" content="#000">
  49. <meta name="color:Description" content="#8d8b8b">
  50. <meta name="color:Description BG" content="#000">
  51. <meta name="color:Title" content="#7b7979">
  52. <meta name="color:Title Hover" content="#8fa0a6">
  53. <meta name="color:Title BG" content="">
  54.  
  55. <meta name="color:Pagination" content="#6b8ba3">
  56. <meta name="color:Pagination Hover" content="#a0b7c8">
  57.  
  58. <meta name="color:Post Title" content="#6f7f90">
  59. <meta name="color:Link Post" content="#6f7f90">
  60. <meta name="color:Link Post Hover" content="#c4c2c3">
  61. <meta name="color:Track Text" content="#696969">
  62. <meta name="color:Album BG" content="#ebebe9">
  63.  
  64. <meta name="color:Scrollbar" content="#909090">
  65. <meta name="color:Scrollbar Background" content="#454444">
  66.  
  67. <meta name="color:Permalink" content="#6f6f6f">
  68. <meta name="color:Permalink BG" content="#fff">
  69. <meta name="color:Permalink Hover" content="#ccc">
  70. <meta name="color:PermaInfo BG" content="#e2e0df">
  71. <meta name="color:PermaInfo" content="#9b9a99">
  72. <meta name="color:PermaInfo BG Hover" content="#626260">
  73. <meta name="color:PermaInfo Hover" content="#ccc">
  74. <meta name="color:Tag" content="#777">
  75. <meta name="color:Tag Hover" content="#ccc">
  76.  
  77. <meta name="text:Link 1" content="Link 1">
  78. <meta name="text:Link 1 URL" content="/">
  79. <meta name="text:Link 2" content="Link 2">
  80. <meta name="text:Link 2 URL" content="/">
  81. <meta name="text:Link 3" content="Link 3">
  82. <meta name="text:Link 3 URL" content="/">
  83. <meta name="text:Link 4" content="Link 4">
  84. <meta name="text:Link 4 URL" content="/">
  85.  
  86. <meta name="if:250 Posts" content="1">
  87. <meta name="if:400 Posts" content="0">
  88. <meta name="if:500 Posts" content="0">
  89. <meta name="if:Captions" content="0">
  90. <meta name="if:Infinite Scroll" content="1">
  91. <meta name="if:Month Day Year" content="0">
  92. <meta name="if:Day Month Year" content="0">
  93. <meta name="if:Year Month Day" content="1">
  94. <meta name="if:Title" content="1">
  95. <meta name="if:12 Hour Time" content="0">
  96. <meta name="if:Black Audio Player" content="0">
  97.  
  98. <meta name="font:Body Font" content="Calibri">
  99.  
  100. <title>{Title}</title>
  101.  
  102. <link rel="shortcut icon" href="{Favicon}" />
  103.  
  104. <link href='http://fonts.googleapis.com/css?family=Libre+Baskerville:400italic' rel='stylesheet' type='text/css'>
  105.  
  106. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  107.  
  108. <script src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script> <script> (function($){ $(document).ready(function(){ $("[title]").style_my_tooltips({tip_follows_cursor:true,tip_delay_time:250, tip_fade_speed:350, attribute:"title"}); }); })(jQuery); </script>
  109.  
  110. <style type= "text/css">
  111.  
  112. @font-face {
  113. font-family: "Intro Inline";
  114. src: url('https://dl.dropboxusercontent.com/u/81174604/intro_inline.otf');
  115. }
  116.  
  117. ::-webkit-scrollbar-thumb:vertical {
  118. background-color:{color:Scrollbar};
  119. height: 30px;
  120. }
  121.  
  122. ::-webkit-scrollbar-thumb:horizontal {
  123. background-color:{color:Scrollbar};
  124. width: 30px;
  125. }
  126.  
  127. ::-webkit-scrollbar {
  128. background-color:{color:Scrollbar Background};
  129. height: 4px;
  130. width: 4px;
  131. }
  132.  
  133. body {
  134. background-attachment: fixed;
  135. background-image: url('{image:Background}');
  136. background-color: {color:Background};
  137. font-family: Calibri;
  138. font-size: 11px;
  139. margin-left: 0px;
  140. margin-top: 0px;
  141. }
  142.  
  143. a:link, a:active, a:visited {
  144. text-decoration:none;
  145. color: {color:Link};
  146. -webkit-transition: all 0.4s ease-in-out;
  147. -moz-transition: all 0.4s ease-in-out;
  148. -o-transition: all 0.4s ease-in-out;
  149. }
  150.  
  151. a:hover {
  152. color: {color:Link Hover};
  153. }
  154.  
  155. iframe#tumblr_controls{
  156. position: fixed;
  157. right: 0px;
  158. top: 0px;
  159. opacity: 0.8;
  160. }
  161.  
  162. #s-m-t-tooltip {
  163. display: block;
  164. font-family: calibri;
  165. text-transform: UPPERCASE;
  166. background: {color:Link Hover BG};
  167. font-size: 8px;
  168. line-height: 10px;
  169. letter-spacing: 1px;
  170. border: double 3px {color:Link Hover Border};
  171. color:{color:Link Hover Text};
  172. max-width: 250px;
  173. word-wrap: break-word;
  174. padding:1px 3px ;
  175. margin: 21px 1px 1px 15px;
  176. z-index: 999999;
  177. text-align:left;
  178. font-style:italic
  179. opacity: 1;
  180. }
  181.  
  182. b, strong, .strong, i, em, .em {
  183. color:{color:Emphasis Text};
  184. }
  185.  
  186. blockquote {
  187. background-color: {color:Blockquote BG};
  188. border-left: 2px solid {color:Text};
  189. margin: 0;
  190. padding: 5px;
  191. margin-left: 25px;
  192. margin-top: 20px;
  193. margin-bottom: 20px;
  194. }
  195.  
  196. /*TITLE*/
  197. #title {
  198. text-align: center;
  199. background: {color:Title BG};
  200. position: fixed;
  201. top: 387px;
  202. left: 100px;
  203. line-height: 15px;
  204. padding: 5px 10px;
  205. width: 180px;
  206. font-family: libre baskerville;
  207. font-size: 17px;
  208. font-style: italic;
  209. }
  210.  
  211. #title a {
  212. color: {color:Title};
  213. }
  214.  
  215. #title a:hover {
  216. color: {color:Title Hover};
  217. }
  218.  
  219. /*SIDEBAR 1*/
  220. #sidebar1 {
  221. top: 175px;
  222. width: 75px;
  223. height: 75px;
  224. position:fixed;
  225. left: 100px;
  226. background-color: {color:Sidebar 1 Border};
  227. border: 10px solid {color:Sidebar 1 Border};
  228. -webkit-transition: all 0.8s;
  229. -moz-transition: all 0.8s;
  230. -o-transition: all 0.8s ;
  231. }
  232.  
  233. #sidebar1 img {
  234. height: 75px;
  235. width: 75px;
  236. -webkit-transition: all 0.6s ease-out;
  237. -moz-transition: all 0.6s ease-out;
  238. -o-transition: all 0.6s ease-out;
  239. }
  240.  
  241. .desc {
  242. position: fixed;
  243. text-align: center;
  244. width: 75px;
  245. height: 75px;
  246. max-width: 75px;
  247. max-height: 75px;
  248. margin-left: -10px;
  249. overflow-y: auto;
  250. padding: 0px;
  251. border: 10px solid {color:Description BG};
  252. font-size: 8px;
  253. margin-top: -10px;
  254. letter-spacing: 1px;
  255. line-height: 10px;
  256. font-family: trebuchet ms;
  257. text-transform: uppercase;
  258. z-index: 3;
  259. opacity: 0;
  260. background-color: {color:Description BG};
  261. color: {color:Description};
  262. -webkit-transition: all 0.8s;
  263. -moz-transition: all 0.8s;
  264. -o-transition: all 0.8s ;
  265. }
  266.  
  267. .desc a {
  268. color: {color:Sidebar Link};
  269. -webkit-transition: all 0.3s ease-out;
  270. -moz-transition: all 0.3s ease-out;
  271. -o-transition: all 0.3s ease-out;
  272. }
  273.  
  274. .desc a:hover {
  275. color: {color:Sidebar Link Hover};
  276. }
  277.  
  278. #sidebar4:hover .desc {
  279. opacity: 0.8;
  280. margin-left: -115px;
  281. }
  282.  
  283. /*SIDEBAR 2*/
  284. #sidebar4 {
  285. top:280px;
  286. width: 75px;
  287. height: 75px;
  288. position:fixed;
  289. left: 205px;
  290. background-color: {color:Sidebar 4 Border};
  291. border: 10px solid {color:Sidebar 4 Border};
  292. -webkit-transition: all 0.8s;
  293. -moz-transition: all 0.8s;
  294. -o-transition: all 0.8s ;
  295. }
  296.  
  297. #sidebar4 img {
  298. width: 75px;
  299. height: 75px;
  300. -webkit-transition: all 0.6s ease-out;
  301. -moz-transition: all 0.6s ease-out;
  302. -o-transition: all 0.6s ease-out;
  303. }
  304.  
  305. .link {
  306. position: fixed;
  307. text-align: center;
  308. width: 75px;
  309. height: 75px;
  310. max-width: 75px;
  311. max-height: 75px;
  312. margin-left: -10px;
  313. overflow-y: auto;
  314. padding: 0px;
  315. border: 10px solid {color:Sidebar Link BG};
  316. font-size: 8px;
  317. margin-top: -88px;
  318. letter-spacing: 1px;
  319. line-height: 10px;
  320. font-family: trebuchet ms;
  321. text-transform: uppercase;
  322. z-index: 9999999;
  323. opacity: 0;
  324. background-color: {color:Sidebar Link BG};
  325. color: {color:Sidebar Link};
  326. -webkit-transition: all 0.8s;
  327. -moz-transition: all 0.8s;
  328. -o-transition: all 0.8s ;
  329. }
  330.  
  331. #sidebar1:hover .link {
  332. margin-left: 95px;
  333. opacity: 0.8;
  334. }
  335.  
  336. /*OTHER SIDEBARS*/
  337. #sidebar2 {
  338. top:175px;
  339. width: 75px;
  340. height: 75px;
  341. position:fixed;
  342. left: 205px;
  343. background-repeat: no-repeat;
  344. background-position: center;
  345. background-color: {color:Sidebar 2 Border};
  346. background-image: url('{image:Sidebar2}');
  347. background-size: 75px;
  348. border: 10px solid {color:Sidebar 2 Border};
  349. -webkit-transition: all 0.8s;
  350. -moz-transition: all 0.8s;
  351. -o-transition: all 0.8s ;
  352. }
  353.  
  354. #sidebar1:hover #sidebar2 {
  355. opacity: 0;
  356. }
  357.  
  358. #sidebar3 {
  359. top:280px;
  360. width: 75px;
  361. height: 75px;
  362. position:fixed;
  363. left: 100px;
  364. background-repeat: no-repeat;
  365. background-position: center;
  366. background-image: url('{image:Sidebar3}');
  367. background-size: 75px;
  368. background-color: {color:Sidebar 3 Border};
  369. border: 10px solid {color:Sidebar 3 Border};
  370. -webkit-transition: all 0.8s;
  371. -moz-transition: all 0.8s;
  372. -o-transition: all 0.8s ;
  373. }
  374.  
  375. #sidebar4:hover #sidebar3 {
  376. opacity: 0;
  377. }
  378.  
  379. /*LINKS*/
  380. .lnk {
  381. font-size: 8px;
  382. letter-spacing: 1px;
  383. line-height: 12px;
  384. font-family: trebuchet ms;
  385. text-transform: uppercase;
  386. color: {color:Sidebar Link};
  387. }
  388.  
  389. .lnk a {
  390. color: {color:Sidebar Link};
  391. -webkit-transition: all 0.3s ease-out;
  392. -moz-transition: all 0.3s ease-out;
  393. -o-transition: all 0.3s ease-out;
  394. }
  395.  
  396. .lnk a:hover {
  397. letter-spacing: 3px;
  398. color: {color:Sidebar Link Hover};
  399. }
  400.  
  401. /*POSTS*/
  402. #content {
  403. opacity: 1;
  404. text-align: left;
  405. margin-top: 88px;
  406. margin-bottom: 40px;
  407. margin-left: 400px;
  408. z-index: 9999;
  409. {block:IndexPage}
  410. {block:if250Posts}
  411. width: 544px;
  412. {/block:if250Posts}
  413. {block:if400Posts}
  414. width: 412px;
  415. {/block:if400Posts}
  416. {block:if500Posts}
  417. width: 512px;
  418. {/block:if500Posts}
  419. {/block:IndexPage}
  420. {block:PermalinkPage}
  421. width: 512px;
  422. {/block:PermalinkPage}
  423. }
  424.  
  425. .post {
  426. text-align: left;
  427. float: left;
  428. margin-bottom: 20px;
  429. padding: 5px;
  430. font-family: {font:Body Font};
  431. font-size: 11px;
  432. line-height: 13px;
  433. {block:IndexPage}
  434. {block:if250Posts}
  435. margin-right: 10px;
  436. margin-bottom: 10px;
  437. width: 250px;
  438. {/block:if250Posts}
  439. {block:if400Posts}
  440. width: 400px;
  441. {/block:if400Posts}
  442. {block:if500Posts}
  443. width: 500px;
  444. {/block:if500Posts}
  445. {/block:IndexPage}
  446. {block:PermalinkPage}
  447. width: 500px;
  448. {/block:PermalinkPage}
  449. color: {color:Text};
  450. z-index: 100;
  451. float: left;
  452. border: solid 1px {color:Post Border};
  453. background-color: {color:Post};
  454. {block:if250Posts}
  455. overflow: hidden;
  456. {/block:if250Posts}
  457. {block:ifnot250Posts}
  458. overflow: visible;
  459. {/block:ifnot250Posts}
  460. }
  461.  
  462. .tumblrAutoPager_page_info, .tumblrAutoPager_page_separator {
  463. display:none;
  464. }
  465.  
  466. #infscr-loading {
  467. display:none;
  468. }
  469.  
  470. .nav {
  471. display:none!important;
  472. }
  473.  
  474. /*TITLE*/
  475. .posttitle {
  476. margin-bottom: 15px;
  477. text-align: center;
  478. font-size: 11px;
  479. line-height: 13px;
  480. letter-spacing: 1px;
  481. margin-top: 5px;
  482. font-family: libre baskerville;
  483. font-style: italic;
  484. text-transform: lowercase;
  485. color: {color:Post Title};
  486. }
  487.  
  488. .linktitle {
  489. color: {color:Post Title};
  490. text-align: center;
  491. font-size: 11px;
  492. line-height: 11px;
  493. letter-spacing: 1px;
  494. margin-top: 5px;
  495. font-style: italic;
  496. font-family: libre baskerville;
  497. text-transform: lowercase;
  498. }
  499.  
  500. .linktitle a {
  501. color: {color:Link Post};
  502. -webkit-transition: all 0.4s linear;
  503. -moz-transition: all 0.4s linear;
  504. -o-transition: all 0.4s linear;
  505. }
  506.  
  507. .linktitle a:hover {
  508. color: {color:Link Post Hover};
  509. padding-bottom: 0px;
  510. }
  511.  
  512. /*QUOTE*/
  513. .quote {
  514. text-align: center;
  515. font-style: italic;
  516. color: {color:Text};
  517. }
  518.  
  519. /*AUDIO*/
  520. .album {
  521. background-repeat: no-repeat;
  522. background-position: center;
  523. position: absolute;
  524. {block:IndexPage}
  525. {block:if250Posts}
  526. width: 75px;
  527. height: 75px;
  528. background-size: 50px;
  529. {/block:if250Posts}
  530. {block:if400Posts}
  531. width: 150px;
  532. height: 150px;
  533. background-size: 90px;
  534. {/block:if400Posts}
  535. {block:if500Posts}
  536. width: 150px;
  537. height: 150px;
  538. background-size: 90px;
  539. {/block:if500Posts}
  540. {/block:IndexPage}
  541. {block:PermalinkPage}
  542. width: 150px;
  543. height: 150px;
  544. background-size: 90px;
  545. {/block:PermalinkPage}
  546. background-image: url('https://cdn2.iconfinder.com/data/icons/ios-7-icons/50/high_volume-128.png');
  547. overflow: hidden;
  548. background-color: {color:Album BG};
  549. }
  550.  
  551. .album img {
  552. {block:IndexPage}
  553. {block:if250Posts}
  554. width: 75px;
  555. height: 75px;
  556. {/block:if250Posts}
  557. {block:if400Posts}
  558. width: 150px;
  559. height: 150px;
  560. {/block:if400Posts}
  561. {block:if500Posts}
  562. width: 150px;
  563. height: 150px;
  564. {/block:if500Posts}
  565. {/block:IndexPage}
  566. {block:PermalinkPage}
  567. width: 150px;
  568. height: 150px;
  569. {/block:PermalinkPage}
  570. overflow: hidden;
  571. }
  572.  
  573. .player {
  574. height: 32px;
  575. overflow: hidden;
  576. float: left;
  577. margin-bottom: 0px;
  578. padding-left: 19px;
  579. padding-right: 21px;
  580. opacity: 0.8;
  581. {block:IndexPage}
  582. {block:if250Posts}
  583. padding-left: 14px;
  584. margin-left: 80px;
  585. width: 135px;
  586. {/block:if250Posts}
  587. {block:if400Posts}
  588. width: 205px;
  589. margin-bottom: 5px;
  590. margin-left: 155px;
  591. {/block:if400Posts}
  592. {block:if500Posts}
  593. width: 305px;
  594. margin-left: 155px;
  595. margin-bottom: 5px;
  596. {/block:if500Posts}
  597. {/block:IndexPage}
  598. {block:PermalinkPage}
  599. width: 305px;
  600. margin-left: 155px;
  601. margin-bottom: 5px;
  602. {/block:PermalinkPage}
  603. {block:ifBlackAudioPlayer}
  604. background-color: #000;
  605. {/block:ifBlackAudioPlayer}
  606. {block:ifnotBlackAudioPlayer}
  607. background-color: #fff;
  608. {/block:ifnotBlackAudioPlayer}
  609. z-index: 10;
  610. }
  611.  
  612. .track {
  613. overflow: auto;
  614. margin-left: 80px;
  615. padding: 2px 10px 2px 3px;
  616. color: {color:Track Text};
  617. {block:IndexPage}
  618. {block:if250Posts}
  619. min-height: 41px;
  620. margin-top: -20px;
  621. margin-left: 80px;
  622. width: 156px
  623. {/block:if250Posts}
  624. {block:if400Posts}
  625. width: 232px;
  626. min-height: 107px;
  627. margin-left: 155px;
  628. {/block:if400Posts}
  629. {block:if500Posts}
  630. width: 332px;
  631. min-height: 107px;
  632. margin-left: 155px;
  633. {/block:if500Posts}
  634. {/block:IndexPage}
  635. {block:PermalinkPage}
  636. width: 332px;
  637. min-height: 107px;
  638. margin-left: 155px;
  639. {/block:PermalinkPage}
  640. }
  641.  
  642. /*ANSWER*/
  643. .portrait {
  644. width:75px;
  645. }
  646.  
  647. .portrait img {
  648. width:75px;
  649. }
  650.  
  651. /*CAPTION*/
  652. .caption {
  653. line-height: 12px;
  654. text-align: left;
  655. {block:if250Posts}
  656. margin-top: -5px;
  657. {/block:if250Posts}
  658. {block:if400Posts}
  659. margin-top: -5px;
  660. {/block:if400Posts}
  661. {block:if500Posts}
  662. margin-top: -5px;
  663. {/block:if500Posts}
  664. }
  665.  
  666. /*TAG*/
  667. #tag {
  668. color:{color:Tag};
  669. line-height: 12px;
  670. margin-bottom: 20px;
  671. text-transform: UPPERCASE;
  672. font-size: 9px;
  673. font-size: calibri;
  674. letter-spacing: 2px;
  675. }
  676.  
  677. .tags {
  678. display: inline-block;
  679. color:{color:Tag};
  680. }
  681.  
  682. .tags a {
  683. color:{color:Tag};
  684. }
  685.  
  686. .tags a:hover {
  687. color:{color:Tag Hover};
  688. }
  689.  
  690. /*PERMALINK*/
  691. #perm {
  692. {block:IndexPage}
  693. font-family: trebuchet ms;
  694. font-size: 9px;
  695. letter-spacing: 1px;
  696. text-transform: UPPERCASE;
  697. margin-top: 0px;
  698. padding: 2px 0px 2px 0px;
  699. opacity: 0;
  700. z-index: 9000;
  701. text-align: center;
  702. position: absolute;
  703. margin-left: 10px;
  704. color: {color:Permalink};
  705. background-color: {color:Permalink BG};
  706. {block:if250Posts}
  707. width: 230px;
  708. {/block:if250Posts}
  709. {block:if400Posts}
  710. width: 380px;
  711. {/block:if400Posts}
  712. {block:if500Posts}
  713. width: 480px;
  714. {/block:if500Posts}
  715. -webkit-transition: all 0.4s ease-out;
  716. -moz-transition: all 0.4s ease-out;
  717. -o-transition: all 0.4s ease-out;
  718. {/block:IndexPage}
  719. }
  720.  
  721. #perm a {
  722. color: {color:Permalink};
  723. -webkit-transition: all 0.3s ease-out;
  724. -moz-transition: all 0.3s ease-out;
  725. -o-transition: all 0.3s ease-out;
  726. }
  727.  
  728. #perm a:hover {
  729. color: {color:Permalink Hover};
  730. }
  731.  
  732. .post:hover #perm {
  733. {block:IndexPage}
  734. margin-top: -25px;
  735. opacity: 0.9;
  736. {/block:IndexPage}
  737. }
  738.  
  739. #fabperm {
  740. {block:IndexPage}
  741. border-top: solid 1px {color:Text};
  742. font-family: trebuchet ms;
  743. font-size: 8px;
  744. letter-spacing: 1px;
  745. text-transform: UPPERCASE;
  746. margin-top: 7px;
  747. padding: 1px 5px 0px 5px;
  748. z-index: 9000;
  749. text-align: center;
  750. color: {color:Permalink};
  751. {block:if250Posts}
  752. width: 240px;
  753. {/block:if250Posts}
  754. {block:if400Posts}
  755. width: 390px;
  756. {/block:if400Posts}
  757. {block:if500Posts}
  758. width: 490px;
  759. {/block:if500Posts}
  760. -webkit-transition: all 0.5s ease-out;
  761. -moz-transition: all 0.5s ease-out;
  762. -o-transition: all 0.5s ease-out;
  763. {/block:IndexPage}
  764. }
  765.  
  766. #fabperm a:hover {
  767. color: {color:Permalink Hover};
  768. }
  769.  
  770. /*PERMALINK PAGE*/
  771. ol.notes {
  772. font-style: italic;
  773. padding: 0px;
  774. margin: 25px 0px;
  775. list-style-type: none;
  776. border-bottom: solid 1px {color:Post Border};
  777. }
  778.  
  779. ol.notes li.note {
  780. border-top: solid 1px {color:Post Border};
  781. padding: 10px;
  782. }
  783.  
  784. ol.notes li.note img.avatar {
  785. vertical-align: -4px;
  786. margin-right: 10px;
  787. width: 16px;
  788. height: 16px;
  789. }
  790.  
  791. ol.notes li.note span.action {
  792. font-weight: normal;
  793. }
  794.  
  795. ol.notes li.note .answer_content {
  796. font-weight: normal;
  797. }
  798.  
  799. ol.notes li.note blockquote {
  800. border-color: {color:Post Border};
  801. padding: 3px 10px;
  802. margin: 10px 0px 0px 25px;
  803. }
  804.  
  805. ol.notes li.note blockquote a {
  806. text-decoration: none;
  807. }
  808.  
  809. .notess {
  810. height: 300px;
  811. overflow-y: auto;
  812. text-align: left;
  813. line-height: 30px;
  814. padding: 1px 0px 1px 0px;
  815. background-color: {color:Post};
  816. max-width: 520px;
  817. font-family: Calibri;
  818. font-size: 11px;
  819. padding: 10px;
  820. background-color: {color:Post};
  821. color: {color:Text};
  822. width:498px;
  823. }
  824.  
  825. #pcont {
  826. width: 520px;
  827. }
  828.  
  829. .booglyboo {
  830. font-size: 9px;
  831. letter-spacing: 2px;
  832. text-transform: UPPERCASE;
  833. display: inline-block;
  834. margin-right: -1px;
  835. width: 90px;
  836. padding: 3px 6px 3px 6px;
  837. text-align: center;
  838. color: {color:PermaInfo};
  839. background-color: {color:PermaInfo BG};
  840. -webkit-transition: all 0.5s ease-out;
  841. -moz-transition: all 0.5s ease-out;
  842. -o-transition: all 0.5s ease-out;
  843. }
  844.  
  845. .booglyboo a {
  846. color:{color:PermaInfo};
  847. -webkit-transition: all 0.5s ease-out;
  848. -moz-transition: all 0.5s ease-out;
  849. -o-transition: all 0.5s ease-out;
  850. }
  851.  
  852. .booglyboo:hover {
  853. background-color: {color:PermaInfo BG Hover};
  854. color: {color:PermaInfo Hover};
  855. }
  856.  
  857. .booglyboo a:hover {
  858. color: {color:PermaInfo Hover};
  859. }
  860.  
  861. /*PAGINATION*/
  862. .pagi1 {
  863. font-family: Intro Inline;
  864. font-size: 30px;
  865. color: {color:Pagination};
  866. top: 253px;
  867. position: fixed;
  868. {block:IndexPage}
  869. left: 75px;
  870. {/block:IndexPage}
  871. }
  872.  
  873. .pagi1 a {
  874. color: {color:Pagination};
  875. -webkit-transition: all 0.5s ease-out;
  876. -moz-transition: all 0.5s ease-out;
  877. -o-transition: all 0.5s ease-out;
  878. }
  879.  
  880. .pagi1 a:hover {
  881. color: {color:Pagination Hover};
  882. }
  883.  
  884. .pagi2 {
  885. font-family: Intro Inline;
  886. font-size: 30px;
  887. color: {color:Pagination};
  888. top: 253px;
  889. position: fixed;
  890. {block:IndexPage}
  891. left: 309px;
  892. {/block:IndexPage}
  893. }
  894.  
  895. .pagi2 a {
  896. color: {color:Pagination};
  897. -webkit-transition: all 0.5s ease-out;
  898. -moz-transition: all 0.5s ease-out;
  899. -o-transition: all 0.5s ease-out;
  900. }
  901.  
  902. .pagi2 a:hover {
  903. color: {color:Pagination Hover};
  904. }
  905.  
  906. .tao {
  907. right: 10px;
  908. bottom: 5px;
  909. font-size: 11px;
  910. position: fixed;
  911. font-family: calibri;
  912. }
  913.  
  914. .tao a {
  915. color: #ccc;
  916. }
  917.  
  918. .tao a:hover {
  919. color: #fff;
  920. }
  921.  
  922. </style>
  923.  
  924. {block:IndexPage}
  925. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
  926.  
  927. <script src="http://static.tumblr.com/6hsqxdt/vmwm2rb4g/infinitescrolling.js"></script><script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  928.  
  929. <script>
  930. $(function(){
  931. var $container = $('#content');
  932. $container.imagesLoaded(function(){
  933. $container.masonry({
  934. itemSelector: '.post',
  935. });
  936. });
  937. $container.infinitescroll({
  938. itemSelector : ".post",
  939. navSelector : "div.nav",
  940. nextSelector : ".nav a#next",
  941. loadingImg : "",
  942. loadingText : "<em></em>",
  943. bufferPx : 10000,
  944. extraScrollPx: 12000,
  945. },
  946. // trigger Masonry as a callback
  947. function( newElements ) {
  948. var $newElems = $( newElements ).css({ opacity: 0 });
  949. // ensure that images load before adding to masonry layout
  950. $newElems.imagesLoaded(function(){
  951. $newElems.animate({ opacity: 1 });
  952. $container.masonry( 'appended', $newElems, true );
  953. });
  954. }
  955. );
  956. });
  957. </script>
  958. {/block:IndexPage}
  959.  
  960. </head>
  961.  
  962. <body>
  963.  
  964. {block:ifInfiniteScroll}
  965.  
  966. {block:IndexPage}
  967. <div class="nav">
  968. {block:Pagination}
  969. {block:PreviousPage}
  970. <a href="{PreviousPage}">previous</a> &middot;
  971. {/block:PreviousPage}
  972. {block:NextPage}
  973. <a href="{NextPage}" id="next">next</a>
  974. {/block:NextPage}
  975. {/block:Pagination}
  976. </div>
  977. {/block:IndexPage}
  978.  
  979. {/block:ifInfiniteScroll}
  980.  
  981. <div id="sidebar1">
  982.  
  983. <div id="sidebar2"></div>
  984.  
  985. <img src="{image:Sidebar1}">
  986.  
  987. <div class="link">
  988. <div style="margin-top: 2px;"></div>
  989. <div class="lnk"><a href="/">HOME</a></div>
  990. <div class="lnk"><a href="/ask">INBOX</a></div>
  991. <div class="lnk"><a href="{text:Link 1 URL}">{text:Link 1}</a></div>
  992. <div class="lnk"><a href="{text:Link 2 URL}">{text:Link 2}</a></div>
  993. <div class="lnk"><a href="{text:Link 3 URL}">{text:Link 3}</a></div>
  994. <div class="lnk"><a href="{text:Link 4 URL}">{text:Link 4}</a></div>
  995. </div>
  996.  
  997. </div>
  998.  
  999. <div id="sidebar4">
  1000.  
  1001. <div id="sidebar3"></div>
  1002.  
  1003. {block:Description}
  1004. <div class="desc">{Description}</div>
  1005. {/block:Description}
  1006.  
  1007. <img src="{image:Sidebar4}">
  1008.  
  1009. </div>
  1010.  
  1011. {block:ifTitle}
  1012. <div id="title"><a href="/">{Title}</a></div>
  1013. {/block:ifTitle}
  1014.  
  1015. {block:IfNotInfiniteScroll}
  1016. {block:IndexPage}
  1017. {block:Pagination}
  1018. {block:PreviousPage}
  1019. <div class="pagi1">
  1020. <a class="jump_page" href="{PreviousPage}">«</a>
  1021. </div>
  1022. {/block:PreviousPage}
  1023.  
  1024. {block:NextPage}
  1025. <div class="pagi2">
  1026. <a class="jump_page" href="{NextPage}">»</a>
  1027. </div>
  1028. {/block:NextPage}
  1029. {/block:Pagination}
  1030. {/block:IndexPage}
  1031. {/block:IfNotInfiniteScroll}
  1032.  
  1033. <div id="content">
  1034.  
  1035. {block:Posts}
  1036.  
  1037. <div class="post">
  1038.  
  1039. {block:Text}
  1040. {block:Title}<div class="posttitle">— {Title} —</div>{/block:Title}
  1041. <div style="margin-top: -8px;"></div>
  1042. {Body}
  1043. <div style="margin-bottom: -8px;"></div>
  1044.  
  1045. {block:IndexPage}
  1046. <div id="fabperm">
  1047. <a href="{ReblogURL}" title="reblog">reblog</a> ▫
  1048. <a href="{Permalink}" title="{NoteCount} notes">♥</a>
  1049. </div>
  1050. {/block:IndexPage}
  1051.  
  1052. {/block:Text}
  1053.  
  1054. {block:Photo}
  1055. <center>
  1056. {block:IndexPage}
  1057. {block:if250Posts}
  1058. <img src="{PhotoURL-250}" width="250px">
  1059. {/block:if250Posts}
  1060. {block:if400Posts}
  1061. <img src="{PhotoURL-400}" width="400px">
  1062. {/block:if400Posts}
  1063. {block:if500Posts}
  1064. <img src="{PhotoURL-500}" width="500px">
  1065. {/block:if500Posts}
  1066. {block:ifCaptions}
  1067. <div style="margin-bottom: -3px;"></div>
  1068. {block:Caption}
  1069. <div class="caption">
  1070. {Caption}
  1071. <div style="margin-bottom: -8px;"></div>
  1072. </div>
  1073. {/block:Caption}
  1074. {/block:ifCaptions}
  1075. {block:ifnotCaptions}
  1076. <div style="margin-bottom: -3px;"></div>
  1077. {/block:ifnotCaptions}
  1078.  
  1079. <div id="perm">
  1080. <a href="{ReblogURL}" title="reblog">reblog</a> ▫
  1081. <a href="{Permalink}" title="{NoteCount} notes">♥</a>
  1082. </div>
  1083.  
  1084. {/block:IndexPage}
  1085.  
  1086. {block:PermalinkPage}
  1087. <img src="{PhotoURL-500}" width="500px">
  1088. <div style="margin-bottom: -3px;"></div>
  1089. {block:Caption}
  1090. <div class="caption">
  1091. {Caption}
  1092. <div style="margin-bottom: -8px;"></div>
  1093. </div>
  1094. {/block:Caption}
  1095. {/block:PermalinkPage}
  1096. </center>
  1097. {/block:Photo}
  1098.  
  1099. {block:Photoset}
  1100. {block:IndexPage}
  1101. {block:if250Posts}
  1102. {Photoset-250}
  1103. {/block:if250Posts}
  1104. {block:if400Posts}
  1105. {Photoset-400}
  1106. {/block:if400Posts}
  1107. {block:if500Posts}
  1108. {Photoset-500}
  1109. {/block:if500Posts}
  1110. {block:ifCaptions}
  1111. <div style="margin-bottom: -3px;"></div>
  1112. {block:Caption}
  1113. <div class="caption">
  1114. {Caption}
  1115. <div style="margin-bottom: -8px;"></div>
  1116. </div>
  1117. {/block:Caption}
  1118. {/block:ifCaptions}
  1119. {block:ifnotCaptions}
  1120. <div style="margin-bottom: -3px;"></div>
  1121. {/block:ifnotCaptions}
  1122.  
  1123. <div id="perm">
  1124. <a href="{ReblogURL}" title="reblog">reblog</a> ▫
  1125. <a href="{Permalink}" title="{NoteCount} notes">♥</a>
  1126. </div>
  1127.  
  1128. {/block:IndexPage}
  1129.  
  1130. {block:PermalinkPage}
  1131. {Photoset-500}
  1132. <div style="margin-bottom: -3px;"></div>
  1133. {block:Caption}
  1134. <div class="caption">
  1135. {Caption}
  1136. <div style="margin-bottom: -8px;"></div>
  1137. </div>
  1138. {/block:Caption}
  1139. {/block:PermalinkPage}
  1140. {/block:Photoset}
  1141.  
  1142. {block:Quote}
  1143. <div class="linktitle">— {Source} —</div>
  1144. <div class="quote">“{Quote}”</div>
  1145.  
  1146. {block:IndexPage}
  1147. <div id="fabperm">
  1148. <a href="{ReblogURL}" title="reblog">reblog</a> ▫
  1149. <a href="{Permalink}" title="{NoteCount} notes">♥</a>
  1150. </div>
  1151. {/block:IndexPage}
  1152.  
  1153. {/block:Quote}
  1154.  
  1155. {block:Link}
  1156. <div class="linktitle">— <a href="{URL}">{Name}</a> —</div>
  1157. {block:Description}
  1158. <div style="margin-top: -8px;"></div>
  1159. {Description}
  1160. <div style="margin-bottom: -8px;"></div>
  1161. {/block:Description}
  1162.  
  1163. {block:IndexPage}
  1164. <div id="fabperm">
  1165. <a href="{ReblogURL}" title="reblog">reblog</a> ▫
  1166. <a href="{Permalink}" title="{NoteCount} notes">♥</a>
  1167. </div>
  1168. {/block:IndexPage}
  1169.  
  1170. {/block:Link}
  1171.  
  1172. {block:Chat}
  1173. {block:Title}<div class="posttitle">{Title}</div>{/block:Title}
  1174. {block:Lines}
  1175. {block:Label}<b>{Label}</b>
  1176. {/block:Label}
  1177. {Line}<br>
  1178. {/block:Lines}
  1179.  
  1180. {block:IndexPage}
  1181. <div id="fabperm">
  1182. <a href="{ReblogURL}" title="reblog">reblog</a> ▫
  1183. <a href="{Permalink}" title="{NoteCount} notes">♥</a>
  1184. </div>
  1185. {/block:IndexPage}
  1186.  
  1187. {/block:Chat}
  1188.  
  1189. {block:Video}
  1190. {block:IndexPage}
  1191. {block:if250Posts}
  1192. {Video-250}
  1193. {/block:if250Posts}
  1194. {block:if400Posts}
  1195. {Video-400}
  1196. {/block:if400Posts}
  1197. {block:if500Posts}
  1198. {Video-500}
  1199. {/block:if500Posts}
  1200. {block:ifCaptions}
  1201. <div style="margin-bottom: -3px;"></div>
  1202. {block:Caption}
  1203. <div class="caption">
  1204. {Caption}
  1205. <div style="margin-bottom: -8px;"></div>
  1206. </div>
  1207. {/block:Caption}
  1208. {/block:ifCaptions}
  1209. {block:ifnotCaptions}
  1210. <div style="margin-bottom: -4px;"></div>
  1211. {/block:ifnotCaptions}
  1212.  
  1213. <div id="perm">
  1214. <a href="{ReblogURL}" title="reblog">reblog</a> ▫
  1215. <a href="{Permalink}" title="{NoteCount} notes">♥</a>
  1216. </div>
  1217.  
  1218. {/block:IndexPage}
  1219.  
  1220. {block:PermalinkPage}
  1221. {Video-500}
  1222. <div style="margin-bottom: -3px;"></div>
  1223. {block:Caption}
  1224. <div class="caption">
  1225. {Caption}
  1226. <div style="margin-bottom: -8px;"></div>
  1227. </div>
  1228. {/block:Caption}
  1229. {/block:PermalinkPage}
  1230. {/block:Video}
  1231.  
  1232. {block:Answer}
  1233. <table style="margin-top: -3px;margin-left:-3px;padding-bottom:0px;margin-bottom:5px;">
  1234. <tr>
  1235. <td style="vertical-align:top;padding-right:3px;">
  1236. <div class="portrait"><img src="{AskerPortraitURL-64}"></div></td>
  1237. <td style="vertical-align:top;">
  1238. <i>{Asker} whispered:</i><br>
  1239. {Question}
  1240. </td>
  1241. </tr>
  1242. </table>
  1243. <div style="border-bottom: 1px solid {color:PostBorder}; margin-top: -3px;"></div>
  1244. {Answer}
  1245. <div style="margin-bottom: -7px;"></div>
  1246.  
  1247. {block:IndexPage}
  1248. <div id="fabperm">
  1249. <a href="{ReblogURL}" title="reblog">reblog</a> ▫
  1250. <a href="{Permalink}" title="{NoteCount} notes">♥</a>
  1251. </div>
  1252. {/block:IndexPage}
  1253.  
  1254. {/block:Answer}
  1255.  
  1256. {block:Audio}
  1257. {block:AudioPlayer}
  1258. {block:ifBlackAudioPlayer}
  1259. <div class="player">{AudioPlayerBlack}</div>
  1260. {/block:ifBlackAudioPlayer}
  1261. {block:ifnotBlackAudioPlayer}
  1262. <div class="player">{AudioPlayerWhite}</div>
  1263. {/block:ifnotBlackAudioPlayer}
  1264. {/block:AudioPlayer}
  1265.  
  1266. <div class="album">
  1267. {block:AlbumArt}
  1268. {block:IndexPage}
  1269. <img src="{AlbumArtURL}">
  1270. {/block:IndexPage}
  1271. {block:PermalinkPage}
  1272. <img src="{AlbumArtURL}">
  1273. {/block:PermalinkPage}
  1274. {/block:AlbumArt}
  1275. </div>
  1276.  
  1277. <div class="track">
  1278. {block:TrackName}
  1279. Title: {TrackName}<br>
  1280. {/block:TrackName}
  1281. {block:Artist}
  1282. Artist: {Artist}<br>
  1283. {/block:Artist}
  1284. {block:Album}
  1285. Album: {Album}
  1286. {/block:Album}
  1287. </div>
  1288.  
  1289. {block:IndexPage}
  1290. {block:ifCaptions}
  1291. {block:if250Posts}
  1292. <div class="caption">
  1293. {block:Caption}
  1294. {Caption}
  1295. <div style="margin-bottom: -10px;"></div>
  1296. {/block:Caption}
  1297. </div>
  1298. {/block:if250Posts}
  1299. {block:if400Posts}
  1300. {block:Caption}
  1301. <div class="caption"> <div style="margin-top:0px;"></div>
  1302. {Caption}
  1303. <div style="margin-bottom: -10px;"></div>
  1304. </div>
  1305. {/block:Caption}
  1306. {/block:if400Posts}
  1307. {block:if500Posts}
  1308. {block:Caption}
  1309. <div class="caption"> <div style="margin-top:0px;"></div>
  1310. {Caption}
  1311. <div style="margin-bottom: -8px;"></div>
  1312. </div>
  1313. {/block:Caption}
  1314. {/block:if500Posts}
  1315. {/block:ifCaptions}
  1316.  
  1317. {block:if250Posts}
  1318. {block:ifnotCaptions}
  1319. <div style="margin-bottom: -4px;"></div>
  1320. {/block:ifnotCaptions}
  1321. {/block:if250Posts}
  1322.  
  1323. <div id="fabperm">
  1324. <a href="{ReblogURL}" title="reblog">reblog</a> ▫
  1325. <a href="{Permalink}" title="{NoteCount} notes">♥</a>
  1326. </div>
  1327.  
  1328. {/block:IndexPage}
  1329.  
  1330. {block:PermalinkPage}
  1331. {block:Caption}
  1332. <div class="caption"> <div style="margin-top:0px;"></div>
  1333. {Caption}
  1334. <div style="margin-bottom: -8px;"></div>
  1335. </div>
  1336. {/block:Caption}
  1337. {/block:PermalinkPage}
  1338. {/block:Audio}
  1339.  
  1340. {block:ContentSource}
  1341. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1342. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1343. {/block:SourceLogo}
  1344. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1345. {/block:ContentSource}
  1346.  
  1347. </div>
  1348.  
  1349. {block:PermalinkPage}
  1350.  
  1351. <center>
  1352. {block:HasTags}
  1353. <div id="tag">
  1354. {block:Tags}
  1355. <div class="tags">
  1356. <div style="font-size: 8px; display: inline-block;">▫</div>&nbsp<a href="{TagURL}">{Tag}</a>&nbsp
  1357. </div>
  1358. {/block:Tags}
  1359. </div>
  1360. {/block:HasTags}
  1361.  
  1362. <div id="pcont">
  1363. <center>
  1364. {block:RebloggedFrom}
  1365. <div class="booglyboo">
  1366. <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
  1367. </div>
  1368. <div class="booglyboo">
  1369. <a href="{ReblogRootURL}" title= "{ReblogRootName}">origin</a></div>
  1370. {/block:RebloggedFrom}
  1371.  
  1372. {block:NoteCount}
  1373. <div class="booglyboo">{NoteCount} notes</div>
  1374. {/block:NoteCount}
  1375.  
  1376. {block:Date}
  1377. <div class="booglyboo">
  1378. {block:ifMonthDayYear}
  1379. {MonthNumber}/{DayOfMonth}/{Year}
  1380. {/block:ifMonthDayYear}
  1381. {block:ifDayMonthYear}
  1382. {DayOfMonth}/{MonthNumber}/{Year}
  1383. {/block:ifDayMonthYear}
  1384. {block:ifYearMonthDay}
  1385. {Year}/{MonthNumber}/{DayOfMonth}
  1386. {/block:ifYearMonthDay}
  1387. </div>
  1388. {/block:Date}
  1389.  
  1390. {block:Date}
  1391. <div class="booglyboo" style="width: 92px;">
  1392. {block:if12HourTime}
  1393. {12Hour}:{Minutes}{AmPm}
  1394. {/block:if12HourTime}
  1395. {block:ifnot12HourTime}
  1396. {24Hour}:{Minutes}
  1397. {/block:ifnot12HourTime}
  1398. </div>
  1399. {/block:Date}
  1400. </center>
  1401.  
  1402. {block:PostNotes}
  1403. <center>
  1404. <div class="notess">{PostNotes}</div>
  1405. </center>
  1406. {/block:PostNotes}
  1407. </div>
  1408.  
  1409. {/block:PermalinkPage}
  1410.  
  1411. {/block:Posts}
  1412.  
  1413. </div>
  1414.  
  1415. <div class="tao">
  1416. <a href="http://mfe-themes.tumblr.com/" title="theme">©</a>
  1417. </div>
  1418.  
  1419. </body>
  1420.  
  1421. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement